clique aqui


BLOGS QUE ADMIRO ACIMA E OUTROS LINKS ABAIXO

10/11/2012

Tutorial: Menu pontilhado e fundo colorido



Bom pessoal trago mais um menu para coleção, desta vez e feito em linhas eu coloquei verde para ressaltar mais, mas podem modificar como desejarem, os créditos são do blog Sweet Poison tá ok? Então vamos lá?


Quando pronto fica assim

Antes de mais nada vá em seu HTML e então procure por:

]]></b:skin>

Agora a cima dele coloque o próximo código:

#menu-linkie {
width: 160px;
padding: 0;
margin: 0;
font: 14px Century Gothic; /* Fonte do menu */
}
#menu-linkie ul {
list-style: none;
margin: 0;
padding: 0;
}
#menu-linkie li {
border-bottom: 1px solid #B9FFBE; /* Cor e estilo do separador */margin: 0;
}
#menu-linkie li a {
display: block;
padding: 5px 5px 5px 0.5em;
background-color: transparent;
color: #696969; /* Cor da fonte do menu */
text-decoration: none;
}
#menu-linkie li a:hover {
background-color: #A7FF8F; /* Background do menu com o mouse por cima */
color: #000000; /* Cor do texto com o mouse por cima */
}

Adicione um gadget de HTML/Javascript e cole nele o código abaixo

<div id="menu-linkie">
<ul class=menu-linkie;>
<li><a href="URL">Nome do link</a></li>
<li><a href="URL">Nome do link</a></li>
<li><a href="URL">Nome do link</a></li>
<li><a href="URL">Nome do link</a></li>
<li><a href="URL">Nome do link</a></li>
<li><a href="URL">Nome do link</a></li>
</ul></div>
</div>:

Nenhum comentário:

Antes de sair, não esqueça de comentar!