menu sky pink

Olá!  hoje trago um tutorial de um menu os creditos vão para o blo I'll Help You .O menu se chama Sky Pink. Preview aqui.

Ele é bonito para quem tem um layout simples e quer dar uma modernizada.Vamos ver o tuto?

Procure ]]></b:skin> no seu HTML , logo acima cole o código abaixo:

/* MENU SKY PINK BY Ana Paula */
SKYPINK{
COLOR: #737373; /* COR DA FONTE QUANDO PASSA O MOUSE */
TEXT-ALIGN:CENTER;
FONT-SIZE: 11PX; /* TAMANHO DA FONTE DO MENU */
BACKGROUND: #BEEBFA ; /* FUNDO DO MENU */
PADDING: 2PX;
FLOAT: LEFT;
MARGIN: 2PX;
WIDTH: 44%; /* TAMANHO DO MENU */
-WEBKIT-BORDER-BOTTOM-RIGHT-RADIUS: 10PX;
-MOZ-BORDER-RADIUS-TOPRIGHT: 10PX;
-MOZ-BORDER-RADIUS-BOTTOMRIGHT: 10PX;
BORDER-TOP-RIGHT-RADIUS: 10PX;
BORDER-BOTTOM-RIGHT-RADIUS: 10PX;
BORDER-TOP-RIGHT-RADIUS: 0;
-MOZ-BOX-SHADOW: INSET 4PX 0 0PX 0 #A09AA3;
-WEBKIT-BOX-SHADOW: INSET 3PX 0 0PX 0 #FE79AB;
BOX-SHADOW: INSET 5PX 0 0PX 0 #EE79B6;
PADDING: 3PX 3PX 3PX 6PX;
-MOZ-TRANSITION: ALL 0.4S EASE-OUT;
-WEBKIT-TRANSITION: ALL 0.8S EASE-OUT;
-O-TRANSITION: ALL 0.8S EASE-OUT;
-MS-TRANSITION: ALL 0.8S EASE-OUT;
TRANSITION: ALL 0.8S EASE-OUT;}
SKYPINK:HOVER{
BACKGROUND:#D682DE; /* FUNDO DO MENU QUANDO PASSA O MOUSE */
COLOR: #FFF; /* COR DA FONTE QUANDO PASSA O MOUSE */
BORDER-RADIUS: 0PX;
-MOZ-BOX-SHADOW: INSET 550PX 0 0PX 0 #93E0FA;
-WEBKIT-BOX-SHADOW: INSET 550PX 0 0PX 0 #93E0FA;
BOX-SHADOW: INSET 550PX 0 0PX 0 #93E0FA;
COLOR: #818181;}

Para o menu funcionar, use o código abaixo em um gadget java/script.Substitua URL e NOME.

<A HREF="URL1"><SKYPINK>NOME 1</SKYPINK></A></DIV>
<A HREF="URL2"><SKYPINK>NOME 2</SKYPINK></A><BR />
<A HREF="URL3"><SKYPINK>NOME 3</SKYPINK></A><BR />
<A HREF="URL4"><SKYPINK>NOME 4</SKYPINK></A></DIV>

 Fez tudo? Se não der certo, tente de novo ^^  Espero que tenham gostado gente, beijos de Luz