15/01/2013

Tutorial: Menu Arrow

||

Hoje eu vou falar feito norminho, então boa tarde pessoal. Tragou outro tutorial de menu para vocês, esse e bem simples ao passar o mouse sobre as caixinhas do menu, vai aparecer  setinhas, que dai vem o nome "Arrow". Pessoalmente eu gostei muito dele, amo menus simples e que fazem diferença, antes que eu me esqueça os créditos são do KW. Caso queiram dar uma olhadinha no menu, basta clicar no preview.

Abra seu HTML do blog que deseja aplicar o menu, e procure por ]]></b:skin>. Acima dessa tag cole esse código:

@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;}

Arrume  as partes em negrito como se pede, e então salve. Agora vá em seu layout e adicione um gadget de HTML/JavaScript, cole:

<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>

Prontinho! Ai esta o menu, basta personalizar como desejar.

4 comentários:

  1. Aceita afiliação flor?
    princessallstar-official.blogspot.com.br

    ResponderExcluir
  2. Drw, como sou afiliada acho que deveria avizar uahushu'
    ta tendo um jogo valendo divugação por um mes la no blog

    http://kawaii-little-things.blogspot.com.br/

    ResponderExcluir
    Respostas
    1. Yo! Obrigada por me avisar, consertesa participarei

      Excluir

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