domingo, 23 de maio de 2010

Menu horizontal HTML com CSS

Esse é um menu horizontal  HTML com CSS.O menu vai ficar no topo da página.

Copie o código abaixo

<style type="text/css">
#menu ul {
padding:0px;
margin:0px;
float: left;
width: 100%;
background-color:#EDEDED;
list-style:none;
font:80% Tahoma;
}

#menu ul li { display: inline; }

#menu ul li a {
background-color:#EDEDED;
color: #333;
text-decoration: none;
border-bottom:3px solid #EDEDED;
padding: 2px 10px;
float:left;
}

#menu ul li a:hover {
background-color:#D6D6D6;
color: #6D6D6D;
border-bottom:3px solid #EA0000;
}

Cole entre as tag  <head> </head> da sua página

Nota

Se for instalar no blogger, exclua a linha <style type="text/css">  e cole o código antes da tag
]]></b:skin>


Agora copie o código abaixo
<div id="menu">
  <ul>
   <li><a href="#">Home</a></li>
   <li><a href="#">Sobre</a></li>
   <li><a href="#">Artigos</a></li>
   <li><a href="#">Estudos</a></li>
   <li><a href="#">Diretório</a></li>
   <li><a href="#">CURSO</a></li>
   <li><a href="#">Links</a></li>
   <li><a href="#">Contato</a></li>
  </ul>
 </div>

Para alterar os itens do menu, basta inserir, modificar ou excluir as linhas com a tag li na div id=menu.
Cole depois da tag <body> da sua página
Depois salve e pronto!

Marcadores: , , ,

2 Comentários:

Às 27 de agosto de 2010 13:04 , Blogger Gustavo Silva disse...

Este comentário foi removido pelo autor.

 
Às 11 de outubro de 2010 12:33 , Blogger DDG-admin disse...

Estou com um problema em meu blog:
Perdi meu css de comentários,e não consigo restaurar ele de novo.
Alguem poderia mi ajudar,tenho o css e o link de um blog que tem um igual ao meu.
Uma alma vivva pra ajudar por favor ??

 

Postar um comentário

Se você gostou deste artigo deixe um comentário!

Duvidas ou sugestões comentem aqui! =D
*Não insultar autor ou leitores da postagens
*Não pedir parceria por comentários
*Não publicar spam ou similar.

Assinar Postar comentários [Atom]

Links para esta postagem:

Criar um link

<< Página inicial