Tutorial - Menu 3D

Olá novamente, meus amores s2 Resolvi trazer pra vocês um tutorial de um menu que eu adorei! Ele se chama Menu 3D. Ele parece ser gordinho, é bem legal fica assim o resultado:

Quer saber como colocá-lo no seu blog?

Leia Mais!

1° - Vá em Modelo >> Editar HTML. Dê um Ctrl + F ou F3 e procure por:

]]></b:skin>

Acima de ]]></b:skin> cole o seguinte código abaixo:

/*---Menu de bordas---*/
menu {
Font-family: verdana; /*Fonte do menu*/
float: left;
background:#B0C4DE; /* Cor do fundo do Menu */
padding: 5px;
text-align: center;
margin: 2px;
width: 22%; /*Tamanho do menu*/
-webkit-transition-duration: .90s; /*Quando tempo dura o efeito*/
border-bottom: 3px solid #9370DB; /*Borda do menu*/
font-size: 11px; /*Tamanho da fonte do menu*/
Color: #9370DB; /*Cor da fonte*/
-webkit-border-radius: 8px /*Bordas arredondadas*/
}
menu:hover {
Font-family: verdana; /*Fonte do menu quando passa o mouse*/
float: left;
margin: 2px;
background:#9370DB; /* Cor do fundo do Menu quando passa o mouse*/
padding: 5px;
text-align: center;
width: 22%; /*Tamanho do menu quando passa o mouse*/
-webkit-transition-duration: .90s; /*Quando tempo dura o efeito quando passa o mouse*/
border-bottom: 3px solid #B0C4DE; /*Borda do menu quando passa o mouse*/
font-size: 11px; /*Tamanho da fonte do menu quando passa o mouse*/
Color: #ffffff; /*Cor da fonte quando passa o mouse*/
-webkit-border-radius: 8px /*Bordas arredondadas ao passar o mouse*/
}

Edite as cores como preferir :D

Tabela de cores >>aqui<<

Para o menu funcionar no seu blog, cole o seguinte código abaixo em um gadget de HTML/JavaScript:

<a href="Link"><menu>Nome</menu></a>

Repita esse código novamente para mais páginas ^^

Espero que tenham gostado do menu .

Kisses ♥