Tutorial:Menu Horizontal

Tumblr_lszbd0rusq1qfh5vvo1_500_large 
Oiee,gente hoje eu vou postar pra vocês um tutorial  muito legal que eu vi no TAI:
é um menu que você personalizar e tudo,e o melhor,não envolve HTML,legal né então vamos lá:
1- Vá até Design, Elementos de Página, adcione um Gadget HTML/Javascript e adcione o código abaixo:


<div style="text-align: center;"><span style='-moz-border-radius: 7px; background-color:#f781f3; padding: 5px 15px 5px 15px;'><a href="LINK 1 ">categoria 1</a></span> <span style='-moz-border-radius: 7px; background-color:#58acfa; padding:  5px 15px 5px 15px;'><a href="LINK 2">categoria 2</a></span> <span style='-moz-border-radius: 7px; background-color:#81f79f; padding: 5px 15px 5px 15px;'><a href=" LINK 3 ">categoria 3</a></span> <span style='-moz-border-radius: 7px; background-color:#f78181; padding: 5px 15px 5px 15px;'><a href=" LINK 4 ">categoria 4</a></span> <span style='-moz-border-radius: 7px; background-color:#f2f5a9; padding: 5px 15px 5px 15px;'><a href="LINK 5">categoria 5</a></span><br /><br /></div>


2- Para fazer as alterações no seu código siga a explicação abaixo:
moz-border-radius: 7px – É o efeito redondo do seu menu, você pode alterar o número para diminuir ou aumentar este efeito.
5px 15px 5px 15px É o tamanho de cada categoria do menu.
#f781f3 – Cor de cada categoria do menu.
Categoria – Altere para o nome de cada categoria de seu menu.
LINK – É o link de cada categoria do seu menu.
Espero que tenham gostado.


Nenhum comentário:

Postar um comentário

Muito obrigada pela visita*--*
Siga e deixa o seu link que seguirei de volta^^
Ah e me sigam pelo Twitter também,sigo todos de volta.
Twitter:@heeysmile
Volte sempre!
Beijoos Gabriela