• Revista PROGRAMAR: Já está disponível a edição #53 da revista programar. Faz já o download aqui!

Senior

onde colocar o codigo css?

31 mensagens neste tópico

viva malta

tenho o codigo css do meu menu

agora estou em duvidas onde colocar esse codigo no meu website

alguem pode ajudar me?

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Ou colocas dentro da pagina referente (dentro das tags <head>) :

<head>
<style type="text/css">
...
... css aqui
...
</style>
</head>

Ou então num ficheiro externo acabado em .css

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Supondo que estás a usar DreamWeaver/FrontPage/Editor WYSIWYG, sim.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

tou a usar o nvu

e o codigo que quero introduzir e de um menu

[code]<head>
   <link rel="stylesheet" type="text/css" href="/menu/menu_style.css" />
</head>

<div class="nav-container-outer">
   <img src="/menu/images/nav-bg-l.jpg" alt="" class="float-left" />
   <img src="/menu/images/nav-bg-r.jpg" alt="" class="float-right" />
   <ul id="nav-container" class="nav-container">
      <li><a class="item-primary" href="index.html" target="_self">Início</a>
   </li>
       <li><span class="divider divider-vert" ></span></li>
      <li><a class="item-primary" href="videos.html" target="_self">Vídeos</a>
   </li>
       <li><span class="divider divider-vert" ></span></li>
      <li><a class="item-primary" href="imagens.html" target="_self">Imagens</a>
   </li>
       <li><span class="divider divider-vert" ></span></li>
      <li><a class="item-primary" href="votacoes.html" target="_self">Votações</a>
   </li>
       <li><span class="divider divider-vert" ></span></li>
      <li><a class="item-primary" href="membros.html" target="_self">Membros</a>
   </li>
       <li><span class="divider divider-vert" ></span></li>
      <li><a class="item-primary" href="comentarios.html" target="_self">Comentários</a>
   </li>
       <li><span class="divider divider-vert" ></span></li>
      <li><a class="item-primary" href="contacto.html" target="_self">Contacto</a>
   </li>
       <li><span class="divider divider-vert" ></span></li>
      <li class="clear"> </li>
   </ul>
</div>
[/code]

o problema que tou a ter e que nao sei onde irei poe este codigo

penso que seja no codigo fonte

se for no codigo fonte posso por no final do codigo que ja tenho?

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Depende onde queres que o menu apareça. O <link> colocas no <head>. O resto, colocas onde tu querias que apareça.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

queria que aparecesse dentro de uma tabela

neste caso onde e que ponho?

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Se estás no NVU, crias uma tabela onde quiseres, e depois, na tab do código-fonte, vais e dentro da tabela, colocas lá esse código.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <link rel="stylesheet"
type="text/css" href="/menu/menu_style.css">
  <meta
content="text/html; charset=ISO-8859-1"
http-equiv="content-type">
  <title>index</title>
</head>
<body
style="background-image: url(Fundo.jpg);">
<table
style="width: 400px; height: 33px; text-align: left; margin-left: auto; margin-right: auto;"
border="1" cellpadding="2" cellspacing="2">
  <tbody>
    <tr>
      <td><img
style="width: 740px; height: 199px;" alt=""
src="Titulo.png"></td>
    </tr>
  </tbody>
</table>
<br>
<br>
<br>
<table
style="text-align: left; width: 283px; height: 32px;" border="1"
cellpadding="2" cellspacing="2">
  <tbody>
    <tr>
      <td>
      <div class="nav-container-outer"><img
src="/menu/images/nav-bg-l.jpg" alt="" class="float-left">
      <img src="/menu/images/nav-bg-r.jpg"
alt="" class="float-right">
      <ul id="nav-container"
class="nav-container">
        <li><a
class="item-primary" href="index.html" target="_self">Início</a>
        </li>
        <li><span
class="divider divider-vert"></span></li>
        <li><a
class="item-primary" href="videos.html" target="_self">Vídeos</a>
        </li>
        <li><span
class="divider divider-vert"></span></li>
        <li><a
class="item-primary" href="imagens.html" target="_self">Imagens</a>
        </li>
        <li><span
class="divider divider-vert"></span></li>
        <li><a
class="item-primary" href="votacoes.html" target="_self">Votações</a>
        </li>
        <li><span
class="divider divider-vert"></span></li>
        <li><a
class="item-primary" href="membros.html" target="_self">Membros</a>
        </li>
        <li><span
class="divider divider-vert"></span></li>
        <li><a
class="item-primary" href="comentarios.html"
target="_self">Comentários</a>
        </li>
        <li><span
class="divider divider-vert"></span></li>
        <li><a
class="item-primary" href="contacto.html" target="_self">Contacto</a>
        </li>
        <li><span
class="divider divider-vert"></span></li>
        <li class="clear"> </li>
      </ul>
      </div>
      </td>
    </tr>
  </tbody>
</table>
<br>
</body>
</html>

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

E o de ccs, onde tens os links para as imagens. De certeza que o caminho para o ccs está correcto? E a estrutura das pastas, podias dizer? Onde tens as imagens, o css, etc? ;)

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

o link para as imagens acho que e este

<link rel="stylesheet"

type="text/css" href="/menu/menu_style.css">

e tenho as imagens

no C:\Users\Rafa\Documents\site\menu\images\

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites
<div class="nav-container-outer">
   <img src="/menu/images/nav-bg-l.jpg" alt="" class="float-left" />
   <img src="/menu/images/nav-bg-r.jpg" alt="" class="float-right" />
   <ul id="nav-container" class="nav-container">
      <li><a class="item-primary" href="index.html" target="_self">Início</a>
           </li>
       <li><span class="divider divider-vert" ></span></li>
      <li><a class="item-primary" href="videos.html" target="_self">Vídeos</a>
           </li>
       <li><span class="divider divider-vert" ></span></li>
      <li><a class="item-primary" href="imagens.html" target="_self">Imagens</a>
           </li>
       <li><span class="divider divider-vert" ></span></li>
      <li><a class="item-primary" href="votacoes.html" target="_self">Votações</a>
           </li>
       <li><span class="divider divider-vert" ></span></li>
      <li><a class="item-primary" href="membros.html" target="_self">Membros</a>
           </li>
       <li><span class="divider divider-vert" ></span></li>
      <li><a class="item-primary" href="comentarios.html" target="_self">Comentários</a>
           </li>
       <li><span class="divider divider-vert" ></span></li>
      <li><a class="item-primary" href="contacto.html" target="_self">Contacto</a>
           </li>
       <li><span class="divider divider-vert" ></span></li>
      <li class="clear"> </li>
   </ul>
</div>

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

este e o codigo css do meu menu

<style media="all" type="text/css">@import "/menu/menu_style.css";</style>
<div class="menu">
<ul>
<li><a href="index.html" target="_self" >Início</a>
</li>
<li><a href="produtos.html" target="_self" >Produtos</a>
</li>
<li><a href="descarregar.html" target="_self" >Descarregar</a>
<ul>
<li><a href="programas.html" target="_self">Programas</a></li>
<li><a href="manuais.html" target="_self">Manuais</a></li>
</ul>
</li>
<li><a href="empresa.html" target="_self" >Empresa</a>
</li>
<li><a href="apoio.html" target="_self" >Apoio</a>
</li>
</ul>
</div>

e este e codigo que tenho na pagina onde quero por o menu

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <meta
content="text/html; charset=ISO-8859-1"
http-equiv="content-type">
  <title></title>
</head>
<body>
<table style="text-align: left; width: 100%;"
border="1" cellpadding="2" cellspacing="2">
  <tbody>
    <tr>
      <td></td>
    </tr>
    <tr>
      <td></td>
    </tr>
  </tbody>
</table>
<br>
</body>
</html>

ja tentei inserir o codigo na tabela e aparece assim mas nao sei porque nao esta a conseguir ir buscar as imagens do menu que esta na pasta do meu site

http://img33.imageshack.us/img33/2479/tabelacq.jpg

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Isso não é CSS. Isso é HTML. Se adicionas-te um <link>, tens de ter um ficheiro CSS, certo? :)

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Ou seja, mostra o conteúdo do ficheiro menu_style.css para sabermos se os caminhos estão correctos, etc....

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

sim,tenho

tenho o menu_style.css no C:\Users\Rafa\Documents\Site\menu\menu_style.css

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Ou seja, mostra o conteúdo do ficheiro menu_style.css para sabermos se os caminhos estão correctos, etc....

:)

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

era isto que queriam saber

C:\Users\Rafa\Documents\Site\menu\menu_style.css a localizacao do ficheiro

acho que o caminho esta correcto no codigo

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Abre o ficheiro C:\Users\Rafa\Documents\Site\menu\menu_style.css e mostra o conteúdo dele. :)

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites
.menu{
border:none;
border:0px;
margin:0px;
padding:0px;
font: 67.5% "Lucida Sans Unicode", "Bitstream Vera Sans", "Trebuchet Unicode MS", "Lucida Grande", Verdana, Helvetica, sans-serif;
font-size:14px;
font-weight:bold;
}
.menu ul{
background:#333333;
height:35px;
list-style:none;
margin:0;
padding:0;
}
.menu li{
	float:left;
	padding:0px;
	}
.menu li a{
	background:#333333 url("images/seperator.gif") bottom right no-repeat;
	color:#cccccc;
	display:block;
	font-weight:normal;
	line-height:35px;
	margin:0px;
	padding:0px 25px;
	text-align:center;
	text-decoration:none;
	}
	.menu li a:hover, .menu ul li:hover a{
		background: #2580a2 url("images/hover.gif") bottom center no-repeat;
		color:#FFFFFF;
		text-decoration:none;
		}
.menu li ul{
	background:#333333;
	display:none;
	height:auto;
	padding:0px;
	margin:0px;
	border:0px;
	position:absolute;
	width:225px;
	z-index:200;
	/*top:1em;
	/*left:0;*/
	}
.menu li:hover ul{
	display:block;

	}
.menu li li {
	background:url('images/sub_sep.gif') bottom left no-repeat;
	display:block;
	float:none;
	margin:0px;
	padding:0px;
	width:225px;
	}
.menu li:hover li a{
	background:none;

	}
.menu li ul a{
	display:block;
	height:35px;
	font-size:12px;
	font-style:normal;
	margin:0px;
	padding:0px 10px 0px 15px;
	text-align:left;
	}
	.menu li ul a:hover, .menu li ul li:hover a{
		background:#2580a2 url('images/hover_sub.gif') center left no-repeat;
		border:0px;
		color:#ffffff;
		text-decoration:none;
		}
.menu p{
	clear:left;
	}	

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Isso parece um problema de carregar o ficheiro CSS. Coloca antes, na página onde queres pôr o menu:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<link rel="stylesheet" media="all" type="text/css" href="/menu/menu_style.css" />
  <meta
content="text/html; charset=ISO-8859-1"
http-equiv="content-type">
  <title></title>
</head>
<body>
<table style="text-align: left; width: 100%;"
border="1" cellpadding="2" cellspacing="2">
  <tbody>
    <tr>
      <td></td>
    </tr>
    <tr>
      <td></td>
    </tr>
  </tbody>
</table>
<br>
</body>
</html>

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Crie uma conta ou ligue-se para comentar

Só membros podem comentar

Criar nova conta

Registe para ter uma conta na nossa comunidade. É fácil!


Registar nova conta

Entra

Já tem conta? Inicie sessão aqui.


Entrar Agora