[EXCLUSIVO] Menu Simply

31 de mai de 2013 | |

Oi pessoas e.e
Mas um hiatus se passou e eu estou de volta, como andam? Agradeço pelos comentários e pelos 75 seguidores  Amo vocês ♥² Ah, estou precisando trocar o layout, então não sei se faço um layout do blog, o se pego um layout free, se quiserem me dar sugestões de layouts free, eu agradeço <3 Enfim, estava lá eu sem nada pra fazer, resolvi tentar fazer um menu, para verem o resultado, cliquem aqui (Menu Simply), gostaram? Leiam mais para ver o tutorial ~o/

Vá em Modelo > Editar HTML, procurem por "]]></b:skin>"
Encontrou? Acima dessa tag cole esse código:


.simply {
float: center; 
font: 9px "tahoma"; 
color:#fff !important; 
text-align: center; 
text-transform: uppercase; 
background-color: #ffffff; 
 padding: 3px; border-radius: 1px; 
text-shadow: 0 0px 0 #a0a0a0;
margin-bottom: 2px; 
margin-top:2px; 
letter-spacing:0px; 
display: inline-block; 
width: auto; align: center; 
text-align: center; 
-webkit-transition-duration: .50s;
padding: 4xp;
border-top: 1px solid #ccc; 
border-bottom: 1px solid #ccc;
border-left: 1px solid #ccc;
border-right: 1px solid #ccc;
}
.simply:hover {
float: center; 
font: 9px "tahoma"; 
color:#fff !important; 
text-align: center; 
text-transform: uppercase; 
background-color: #ffffff; 
 padding: 3px; border-radius: 1px; 
text-shadow: 0 0px 0 #a0a0a0;
margin-bottom: 5px; 
margin-top:5px; 
letter-spacing:0px; 
display: inline-block; 
width: auto; align: center; 
text-align: center; 
-webkit-transition-duration: .50s;
padding: 4xp;
border-top: 1px solid #000000;
border-bottom: 1px solid #000000;
border-left: 1px solid #000000;
border-right: 1px solid #000000;
}

Na parte das 'border' são as bordas, 'top' a borda de cima, 'bottom' a borda de baixo, 'left' a borda da esquerda e 'right' para a borda da esquerda. '#ccc' é a cor da borda.
Na parte do ".hover {" é o menu quando você passa o mouse em cima, o hover do menu.

Depois de ter editado, para usar o menu, vá em Layout e adicione um gagdet HTML e cole:

<div class="simply"><a href="SEULINK">NOME DO SEU LINK</a></div>

Prontinho! Se for usar o menu, por favor, credite! Se for rebloga-lo, também credite!
Qualquer dúvida, deixe um comentário para que eu possa te ajudar ~
Até mais ~ <3

4 comentários:

  1. Amei o tutu *__*

    Beijos
    Be--Different

    ResponderExcluir
  2. Menu lindo, mto cute ^o^

    http://criticas-on.blogspot.com.br/

    ResponderExcluir
  3. Que menu lindo *__________________*
    ~Chu

    HTML Thing

    ResponderExcluir

Obrigado por comentar! Sua opinião é sempre bem-vinda!

Se não gostou, por favor, não use palavras ofensivas, você pode expressar-se sem precisar prejudicar ninguém

TODOS os comentários são lidos e respondidos por mim!

- Junto com o comentário, coloque o link do seu blog para que eu retribua a visita!
- Comentários com: "Seguindo, segue de volta?" não serão aceitos eu sigo de volta, mas, pelo menos, comente sobre o post

Obrigado!