Patty Perfect ♥ ^^

Hello honeys! Então resolvi hoje ensinar um menu hover super fácil para se usar no blog e por sinal é o que eu uso no menu de Status do blog! Vamos ao post? Clique em Leia Mais!

                             



Bem os créditos vão ao blog Zona Neutra.

Primeiro de tudo clique em vá em Modelo e clique em Editar HTML; depois disso clique em Ctrl+F e vai aparecer uma caixinha nessa caixa pesquise por:

                                                               ]]><b:skin>

E antes de ]]><b:skin> cole esse código abaixo:

.heart {display : block; font-size: 10px;font-family: Tahoma;letter-spacing : 0;border-bottom : 1px solid #eee;background-repeat : no-repeat;   text-indent : 5px;vertical-align : middle;text-decoration : none; line-height : 15px;margin-bottom : 1px;padding-left : 3px; -webkit-transition: all 0.9s ease-out; -moz-transition: all 0.9s ease-out;border-left: solid #CORDABORDA;background: #CORDOFUNDO; color: #666 !important;}.heart:hover {display : block;text-decoration: none; vertical-align: middle;line-height: 15px;background: #CORDOFUNDOHOVER; border-left: solid #CORDABORDAHOVER; padding-left: 15px;}

No código já está tudo explicado mais onde tiver #CORDABORDA ou #CORDOFUNDO substitua por uma cor em HTML (tabela de cores aqui) e onde está em #CORDOFUNDOEMHOVER ou #CORDABORDAEMHOVER substitua também por uma cor em HTML na tabela de cores.

Depois vá em Layout e Adicionar um Gadget e adicione um Html, e depois disso cole esse código abaixo

<div class="heart"> Seu Texto </div>
<div class="heart"> Seu Texto </div>
<div class="heart"> Seu Texto </div> 

Onde tiver Seu Texto escreva algo como o Status do seu blog (assim como está no meu no menu Status) e deixe heart normal sem fazer nenhuma modificação no código apenas somente em Seu Texto.


Espero que tenham gostado do post!


Kisses!