Estilo para menu

 

Oie ~

Vim traze um modelo de menu bem simples de fazer.

1. Vá no seu HTML e procure por: ]]></b:skin>

2. Acima da tag procurada cole o seguinte código:

/*---Início do Menu com Efeito by Bomba de Glitter---*/

bdg {

font-family: tahoma; /* Fonte do Menu */

width: 17%; /* Tamanho do Menu */

float: left;

background:#8EE5EE; /* Cor do fundo do Menu */

padding: 5px;

text-align: center;

margin: 2px;

-webkit-border-radius: 9px 0px 9px 0px; /* Pontinhas da Borda - não modifique se quiser o formato igual ao meu */

-webkit-transition-duration: .80s; /* Duração do Efeito - não modifique se quiser o efeito igual ao meu */

font-size: 08pt; /* Tamanho da fonte */

color: #fff; /* Cor da fonte */

}

bdg:hover {

font-family: tahoma; /* Fonte do Menu quando passa o mouse */

width: 17%; /* Tamanho do Menu quando passa o mouse */

float: left;

background:#FF69B4; /* Cor do fundo do Menu quando passa o mouse */

padding: 5px;

text-align: center;

margin: 2px;

-webkit-border-radius: 0px 9px 0px 9px; /* Pontinhas da Borda - não modifique se quiser o formato igual ao meu */

-webkit-transition-duration: .80s; /* Duração do Efeito - não modifique se quiser o efeito igual ao meu */

font-size: 08pt; /* Tamanho da fonte do Menu quando passa o mouse */

color: #fff; /* Cor da fonte do Menu quando passa o mouse */

}

/*---Fim do Menu com Efeito by Bomba de Glitter---*/ 

 3. Personalize as cores do seu gosto.

Para usar,é só abrir um gadget de HTML/JavasScript e colar esse código fazendo as modificações. 

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

O tutorial foi feito pelo blog Bomba de Glitter e os créditos são todos de lá.