[TUTORIAL] Menu Subsecciones Hover Cajita♥

Hola kawaiii's ¿COmo estan? Yo aqui Bien bien
La Dina desaparecio! x'D Senti que desapareci , Jaja' Por que casi diario ya empezaba a publicar >:< El dia de hoy OxO les traigo un dulce menu Que es mas para subsecciones Que pueden ver que yo tengo en el blog :'3 A algunos les ha de gustar o Otro nose :/
x'D jajaja empezemos !!
Añadir gadget -> HTML Javascript -> Copian con ctrl + c el siguiente codigo & lo pegan en el gadget :) con ctrl + v

<center>

<style type="text/css">

.img-opaco{

background: #E8E6E6;

color: #000;

width: 270px;

height: 210px;

margin-top:-215px;

opacity: 0;

-webkit-transition:all .5s ease-in-out; }

.img-opaco:hover{

opacity:.7

}

</style>

<img src="URL DE LA IMAGEN DE FONDO" width="270" />

<div class="img-opaco">

<center>

 <span class="Apple-style-span" style="font-family: verdana, arial; font-size: medium;"><br />

<span id="nav" style="-webkit-transition: 1s; background-color: #ff3e96; border-radius: 5px; border: #000000 1px dashed; font-family: serif; font-size: 13px; padding: 2px;">

<a href="URL " style="-webkit-transition-duration: 0.5s; color: black; text-decoration: none;">TITULO 1</a></span>

<span id="nav" style="-webkit-transition: 1s; background-color: white; border-radius: 5px; border: #FF3E96 1px dashed; font-family: serif; font-size: 13px; padding: 2px;">

<a href="URL " style="-webkit-transition-duration: 0.5s; color: black; text-decoration: none;">TITULO 1</a></span>

<span id="nav" style="-webkit-transition: 1s; background-color: white; border-radius: 5px; border: #FF3E96 1px dashed; font-family: serif; font-size: 13px; padding: 2px;">

<a href="URL " style="-webkit-transition-duration: 0.5s; color: black; text-decoration: none;">TITULO 1</a></span>

<span id="nav" style="-webkit-transition: 1s; background-color: white; border-radius: 5px; border: #FF3E96 1px dashed; font-family: serif; font-size: 13px; padding: 2px;">

<a href="URL " style="-webkit-transition-duration: 0.5s; color: black; text-decoration: none;">TITULO 1</a></span>

<span style="color: black; font-family: Purisa; font-size: x-small;"><b> <br /><br />

TEXTO AÑADE TEXTO AÑADE TEXTO AÑADE TEXTO

</b></span/> 

</span> </center>

</div></center>

& lISOU Hemos terminado :3 Espero que les aya guistado de hecho para editar ahi tiene todoo expllicado x'D
URL ; PONEN LA URL DE SU SECCION & EL TITULO IMAGEN DE FONTO ES LA URL , ETC.
¿Quieres añadir mas secciones?
<span style antes de ese codigo pega esto ;

<span id="nav" style="-webkit-transition: 1s; background-color: white; border-radius: 5px; border: #FF3E96 1px dashed; font-family: serif; font-size: 13px; padding: 2px;">

<a href="URL " style="-webkit-transition-duration: 0.5s; color: black; text-decoration: none;">TITULO 1</a></span>

& Listo :)
Créditos a Lunany Kawaii
XOXO aDIOS!♥