Super Menu

Perdón Porque no e escrito en mucho tiempo es que estoy full de Tarea en la escuela pero eso no me impide estar con ustedes ,este menu es super lindo xD no sabia que ponerle asi que decidi llamarle SUPER debido al efecto, es como muy WOW XD para el efecto tienes que usar un pattern, luego del tutorial pondre muchas de diferentes colores ^^

SI LO USAS DA CRÉDITOS!!!

PREVIEW....

HOLA

Si te gusta & lo kieres sigue los siguientes pasos...
Plantillas blogger: Pega el siguiente código justo arriba de ]]></b:skin>

Plantillas clásicas/blogskins: Pega el siguiente código justo arriba de </style>

.super {
margin-left: -2px;
margin-right: -2px;
overflow: hidden;
display: block;
height: 19px;
text-align: left;
background: url('URLDELPATTERN') no-repeat;padding-left: 10px;
padding-top: 5px;
margin-bottom: 2px;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease;
}
.super:hover {
background-position: -0px -132px;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease;
margin-left: 80px;
-webkit-border-radius: 15px 0px 0px 15px;
-moz-border-radius: 15px 0px 0px 15px;
border-radius: 15px 0px 0px 15px;
}
.super .title {
color:#999;
font-size: 17px;
font-weight:none;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease;
}
.super:hover .title{
color: #fff;
letter-spacing: 2px;
-webkit-transition: all 0.5s linear;
-moz-transition: all 0.5s linear;
-o-transition: all 0.5s linear;
transition: all 0.5s linear;
text-shadow: 1px 1px 0px #fff;
}

Rojo: Reemplazas por la url del pattern que elegiste.
Aqui estan los patterns! (para conseguir la url, clic derecho sobre la imagen que quieras y "copiar url de imagen")

Yo use la segunda pattern para el ejemplo :3 CLIC EN LA PATTERN QUE QUIERAS PARA VERLA EN TAMAÑO ORIGINAL!

Terminas de editar, guardas los cambios ^^
Para usar el menu usa el siguiente codigo... 

<div class="super"><a href="ENLACE">CATEGORIA</a></div><div class="super"><a href="ENLACE">CATEGORIA</a></div><div class="super"><a href="ENLACE">CATEGORIA</a></div>

Cambias "ENLACE" por la url del link de cada bloque, & "CATEGORIA" por el texto de cada bloque. 
Para añadir mas bloques, o como se llamen xD agrega mas del siguiente código... 

<div class="super"><a href="ENLACE">CATEGORIA</a></div>

Guardas & ya esta!