31/12/2011

Tutorial: Menu barrinhas laterais

||

Hello, como vão todos? Hoje venho trazer um menu horizontal com barrinhas. É super simples mas com ele é possível criar ate outros menus e efeitos, créditos vão para o blog Sweet Poison , então vamos lá tentar?

Quando pronto ficara assim:

Em seu HTML procure por, ]]></b:skin>.
#barrinhaslaterais {
background: #D7D7D7; */Background normal /*
border-left: 4px solid #B6F9F4; */ Cor da barrinha lateral */
font-family: tahoma; */ Fonte do menu */
font-size: 14px; */ Tamanho da fonte */
text-align : left;
padding-bottom : 4px;
padding-left : 6px;
margin-bottom: 5px;
}
#barrinhaslaterais:hover {
background: #D7D7D7; */ Background hover */
border-left: 4px solid #FF0000; */ Cor da barrinha lateral hover */
font-family: tahoma; */ Fonte do menu hover */
font-size: 14px; */ Tamanho da fonte hover */
text-align : left;
padding-bottom : 4px;
padding-left : 6px;
margin-bottom: 5px;
}

Modifique da forma que você desejar, agora adicione um novo gadget de HTML/Javascript e cole isso dentro:
<div id="barrinhaslaterais">
<a href="LINK 1" title="">Nome do link</a></div>
<div id="barrinhaslaterais">
<a href="LINK 2" title="">Nome do link</a> </div>
<div id="barrinhaslaterais">
<a href="LINK 3" title="">Nome do link</a> </div>
<div id="barrinhaslaterais">
<a href="LINK 4" title="">Nome do link</a> </div>

Modifique as partes em negrito e prontinho!

Postagem feita em 31/12/2011 atualizada em 13/04/2015.

Nenhum comentário:

Postar um comentário

Hi guys!!!!
Hey aqui é Wendy, blogueira desde 2010! Viciada em animes, amante de livros e adora ver séries! Criei esse cantinho na intenção de ajudar na criação e personalização de blogs e sites.
Wattpad Facebook Tumblr Instagram