Menu Inverse

Yoo Amoras 
~Boa tarde
Tudo bem??
To aqui de novo, hehe...
Trouxe um tutorial de um menu chamado "Inverse", que é o menu igual ao daqui do blog. Quando você passa o mouse sobre o menu, ele vira de ponta cabeça:

Normal
 

Ao passar o mouse

E aí, quer aprender a fazer??

Vá em Modelo >> Editar HTML >> Aperte Ctrl F ou F3 e procure por:

]]></b:skin>

Acima da tag procurada, cole o seguinte código:

/*Menu Inverse - Pequena Garota*/
inverse{
color: #cordafonte;
text-align:center;
font-size: 11px;
background: #cordefundo;
padding: 2px;
float: left;
margin: 2px;
width: 21%;
-webkit-transition-duration: .80s;
border-radius: 50px;
-moz-transition: 0.7s ease-out;
transition: 0.7s ease-out;
}
inverse:hover{
background: #cordefundohover;
color: #cordafontehover;
-webkit-transition-duration: .80s;
-webkit-transform: rotate(-180deg);
-moz-transform: rotate(-180deg);
}

 Substitua as partes em negrito pela cor que desejar (Recomendo esta tabela de cores)
Bem, agora vá em "Layout" e clique em "Adicionar novo Gadget" escolha o HTML/JavaScript e nele cole o seguinte código:

<a href="URL"><inverse>NOME</inverse></a>

Substitua "URL" pela URL da página que desejar ter no menu
Substitua "Nome" pelo nome que você quer que apareça 
 Créditos: Pequena Garota 

Bom pessoal, é isso!! Espero que tenham gostado!

Kissus~