Tutorial-Menu Simples

Oi meus... Caramelos de Pudim (Eita criatividade ner)
Então tudo bem com vocês?
No post de hoje vou trazer um tutorial super simples para você,o nome diz tudo.

Mais então antes vamos aos créditos:
Créditos do Tutorial e do Visualize total ao Kawaii World
Vamos começar.
Veja o Efeito aqui no gadget Menu Simple
1.Entre no seu HTML e procure por ]]></b:skin> e cole o seguinte código em cima.
@font-face {font-family: "handy"; src: url('http://static.tumblr.com/lnvca6d/E6vm63ih7/pf_ronda_seven__1_.ttf');}
.menusimples {float: center; font: 8px "handy", small fonts; color:#fff !important; text-align: center; text-transform: uppercase; background-color: #f69ebf; padding: 3px; border-radius: 1px; text-shadow: 0 1px 0 #a0a0a0;margin-bottom: 5px; margin-top:5px; letter-spacing:0px; display: inline-block; width: auto; align: center; text-align: center; -webkit-transition-duration: .80s;}
.menusimples:hover { background-color: #404040; -webkit-transition-duration: .80s;}
 Oque esta em Negrito é a cor do fundo.

2. Em um gadget de HTML/JavaScript, cole o seguinte código:
<center><div class="menusimples"><a href="SEU LINK">NOME</a></div> + <div class="menusimples"><a href="SEU LINK">NOME</a></div> + <div class="menusimples"><a href="SEU LINK">NOME</a></div> </center>
Bom edite oque tem para editar e salve Pronto.
Foi útil comente então Beijos da Dessa 

6 comentários: