Assinar Feeds - 311 RSS leitores
26 May 2008
Menu Horizontal
Monday # 16:02 242 palavras Arquivado em: Css, Tutoriais Por Tamara

Menu horizontal semelhante a esse:

01. Adicione ao seu css o código a seguir:

#menu {
list-style: none;
float: left;
height: 25px;
width: 465px;
padding-left:15px;
margin-top: 150px;
}
#menu ul {
padding: 0px;
margin: 0px;
float: left;
width: 100%;
list-style:none;
font-weight: bold;
height: 18px;
line-height: 18px;
vertical-align:middle;
}
#menu ul li {
display: block;
float: left;
margin: 1px;
width: auto;
text-align: center;
border:0px;
}
#menu ul li a {
display: block;
width: 61px;
text-align: center;
font-size: 10px;
font-family : Verdana, Arial, sans-serif;
text-decoration: none;
color: #FEC2E1;
background-color: #FFF1F9;
border:1px solid #FEC2E1;
vertical-align:middle;
}
#menu ul li a:hover, #menu li.current a {
color: #c0c0c0;
background-color: #f8f8f8 ;
text-decoration: none;
border:1px solid #c0c0c0;
}

O posicionamento do meu é feito em #menu.

2. Onde quer que o menu apareça, use:

<div id="menu">
<ul>
<li><a href="http://www.link1.com">Link 1</a></li>
<li><a href="http://www.link2.com">Link 2</a></li>
<li><a href="http://www.link3.com">Link 3</a></li>
</ul>
</div>


« Dynamic Highlight Menu
Bolo de Caneca »



Os comentários desse blog são MODERADOS, portanto só serão publicados após a minha aprovação. Comentários com propagandas e divulgações não serão aprovados. Obrigada.




38 37 36 35 34 33 32 31 30 29 28 27 26 25 24 23 22 21 20 19 18 17 16 15 14 13 12 11 10 9 8 7 6 5 4 3 2 1


6 Comentários em “Menu Horizontal” -


1
Athena 13-12-2008 - 18:49   Responder

Só qeuria dizer que adorei esse tutorial sobre menu, dos vários que tentei esse foi o mais fácil que encontrei para utiçizar no meu blog. O seu site já está na minha seção de créditos!


2
Ayelen 26-02-2009 - 14:51   Responder

you inspire me 9
Ayelen, from Argentina :)


3
Mariiana 22-03-2009 - 10:43   Responder

adoreei o tutorial 26


4
Luanna 12-04-2009 - 10:06   Responder

Adorei aqui ,e simplismente tava presisando de um menu pra organizar meu site^^
beijo boa páscoa! 9


5
Verônica 24-04-2009 - 19:21   Responder

Eu tô loca pra colocar esse menu no meu site, mas eu não estou conseguindo!
Eu coloquei o primeiro css entre o mas não funcionou, deu erro.
Estou fazendo algo errado?
O que devo fazer?
=]
Obrigada


6
tamara 25-04-2009 - 08:56   Responder

Verônica em April 24, 2009 às 19:21 disse:

Eu tô loca pra colocar esse menu no meu site, mas eu não estou conseguindo!
Eu coloquei o primeiro css entre o mas não funcionou, deu erro.
Estou fazendo algo errado?
O que devo fazer?
=]
Obrigada

Com certeza, algo errado você está fazendo, mas não dá para saber exatamente o que é. O menu tem que ser editado, você tem que ajustar as medidas de acordo com seu layout.