Menu miau - Tutorial

Olá meus amores !!! Hoje vou ensinar para vocês a fazer um menu incrível que tem um efeito hover ao passar o mouse por cima dele como mostra na ilustração abaixo :
• Vamos aprender a faze-lo ???

 Primeiramente abra o HTML de seu Blog, dê um ctrl + F e procure por ]]></b:skin> ... 

Após ter achado, cole o código abaixo ANTES de ]]></b:skin>

miau {

background: #f8f8f8;

color: #ffa9d6;

border: 1px solid #ffa9d6;

display:inline;

padding: 6px;

margin: 2px;

font-family: tahoma;

font-size: 11px;

text-align: center;

width: 20%;

float: center;

-webkit-transition-duration: .50s;

}

miau:hover {

background: url(http://i1096.photobucket.com/albums/g336/BellaTuckM/linepattern.png) repeat center;

letter-spacing: 2px;

-webkit-transition-duration: .50s;

}

Para poder usa-lo é só adicionar um gadget HTML/JavaScript e colocar o código abaixo nele :

<div style="text-align: center;><a href="seu_link"><miau>seu título</miau></a>

Espero que tenham gostado do Tutorial  
créditos : Sweet Kawaii