18.12.12

Menu Arrow

Olá de novo seus lindos, agora lá vai mais um tutorial de um Menu, o nome é Menu Arrow

~Let's Go~

Bom, esse menu eu aprendi no Kawaii World

1° - Vá em Design e depois em editar HTML e procure por ]]></b:skin>. Acima dessa tag cole o seguinte:


@font-face {font-family: "handy"; src: url('http://static.tumblr.com/lnvca6d/E6vm63ih7/pf_ronda_seven__1_.ttf');}
.arrow {margin: 1px; text-align: center; font: 8px handy; text-transform: uppercase; display: inline-block; position: relative; color: #000000; width: 45px; padding: 3px; text-decoration: none; background-color: #CORDOFUNDO; border: 2px solid #CORDABORDA;}
.arrow:hover { background-color: #CORDOFUNDOHOVER; border: 2px solid #ef7aa1;}
.arrow:hover:after {
content: ''; width: 0; height: 0; position: absolute; left: 50%; 
margin-left: -2px; bottom: 0; border-width 9px; border-style: solid; border-color: transparent transparent #CORDASETA transparent;}
Agora edite do seu jeito  
2° -  Vá em gadget de HTML/JavaScript, cole o seguinte:

<a href="SEULINK" class="arrow">Menu</a>
<a href="SEULINK" class="arrow">Menu</a>
<a href="SEULINK" class="arrow">Menu</a>
<a href="SEULINK" class="arrow">Menu</a>

Bom, espero ter ajudado! Se você querer algum tutorial é só postar um comentario pedindo iremos responder o mais rapido possivél!
                                                                  
                      

Nenhum comentário:

Postar um comentário