[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!♥

[TUTORIAL] Menu #3 "Sweet Short"

Hola! Kawaii's ¿Como estan? *yop super bien * El dia e les traigo un tutorial que es  muy bonito & sencillito A mi me gusto es algo super agradable Bueno solo lo que tienen que hacer es lo siguiente :D 
Diseño-> Añadir gadget-> HTML Javascript & Copias con CTRL + C El siguiente codigo & Pegas con CTRL +V , Pegamos ;3

<div style="text-align: center;"> <span style="padding: 10px 30px; background-color: rgb(255, 214, 221); -moz-border-radius: 5px;"> <a href="URL" enlace="" de="">TITULO 1</a></span> <span style="padding: 10px 30px; background-color: rgb(255, 134, 170); -moz-border-radius: 5px;"> <a href="URL" enlace="" de="">TITULO 2</a></span> <span style="padding: 10px 30px; background-color: rgb(255, 134, 170); -moz-border-radius: 5px;"> <a href="URL" enlace="" de="">TITULO 3</a></span>  <span style="padding: 10px 30px; background-color: rgb(255, 134, 170); -moz-border-radius: 5px;"> <a href="URL" enlace="" de="">TITULO 4</a></span> <span style="padding: 10px 30px; background-color: rgb(255, 134, 170); -moz-border-radius: 5px;"> <a href="URL" enlace="" de="">TITULO5</a></span><span style="color:#cc33cc;"></span></div>

Aqui editen : 
Morado ; Colocamos la URL DE donde queremos que se diriga nuestro botoncito
moradito rojo ? xD : Es la medida de nuestros botoncitos ... Experimenta medidas!;D
Borgoña : Seleccionan el color que quieran 

Mira Seleccionas color en la gama de colores HTML

& YA DE HABER SELECCIONADO EL CODIGO QUE TOMAS SERA EL DEL

RGB VAS COLOCAR EL CODIGO EN ORDEN PRIMERO LA R ; 255

DE AHI G ; 154

& ULTIMO B ; 195

& Listo!

es un ejemplo solo con el codigo de su color ;3

*CLIK PARA COLORES HTML*

verde ; Colocamos el titulo de nuestra seccion :3

¿Quieres agregar mas secciones?

Entre este codigo que esta a lo ultimo del que les di 

 <a href="URL" enlace="" de="">TITULO5</a></span><span style="color:#cc33cc;">AQUI PEGAN EL OTRO CODIGO</span></div>

 <a href="URL" enlace="" de="">TITULO OPCIONAL</a></span>

 <span style="padding: 10px 30px; background-color: rgb(255, 134, 170); -moz-border-radius: 5px;"> 

 & lISTO ;3
Hemos terminado;D Espero que les guste ♥♥ :33
COMENTEN & DIGANME SI HUBO UN FALLO ._.
Créditos: Annyz Kawaii Blog

Besos Kawaii's♥

Menu Vertical Cute&Kawaii Elegante (DESPLEGABLE&FLOTANTE)!♥

Hi!Kawaii's ¿Como han estado? Yo aqui ando xD *  Hoy les traigo un tutorial de Poner un Menu Vertical . Es muy facil ! Su nombre lo dice es desplegable :-Lo quitas & Lo pones Facilmente ;3
Aparte es Flotante  ! Lo podran utilizar para subsecciones ¿NO?:P Ami me parece mejor asi o cada quien su gusto ... Es este ; 

Esta Elegante como eh dicho xD ... Oki Pues empezemos ;'3

Solo es cosa de ir a -> DISEÑO->AÑADIR GADGET -> HTML Javascript & Copian& Pegan este siguiente codigo ;

<style>.raejun{width:60px;padding:15px;margin-top:15px;box-shadow:2px 2px 4px #DFDFDF;background:#eee;font:8px tt; text-align:center;Text-decoration:none;color:#888;text-transform:uppercase;display:block;-webkit-transition:All 0.5s ease;-moz-transition:All 0.5s ease;-o-transition:All 0.5s ease;border-left:0px solid #000;-webkit-border-top-right-radius: 333px;-webkit-border-bottom-right-radius: 333px;-moz-border-radius-topright: 333px;-moz-border-radius-bottomright: 333px;border-top-right-radius: 333px;border-bottom-right-radius: 333px;}.raejun:hover{width:66px;border-left:10px solid #aaa;}@font-face {font-family:tt !important;src: url('http://static.tumblr.com/rmj06l2/Usellxb4i/tinytots.ttf') !important;}</style><div style="position:fixed; top:100px;left:0px;width:100px; color:#aaa;">

<a class="raejun" href="LINK ">titulo</a>

 <a class="raejun" href="LINK ">titulo</a>    <a class="raejun" href="LINK ">titulo</a><a class="raejun" href="LINK ">titulo</a></div>

ROSA; URL DE DONDE QUIERES QUE SE DIRIJAN  
AZUL;TITULO DE LA SECCION O LO QUE QUIERES QUE LLEVE ;9
NARAJA; Edita los colores en codigos HTML
  

NOTA ;
-QUIERO AGREGAR MAS SECCIONES ... ¡Que hago?
Entre ; (Es el codigo de arriba en Morado entre >&<

</a>AQUI PEGAN CODIGO XD</div>

PEGAN EL SIGUIENTE CODIGO ;

<a class="raejun" href="LINK ">titulo</a> 

 & Listo han terminado & siguen agregando mas  si deseean x3 Espero que les haya Gustado &
claro se le dan créditos al autor del menú (que no soy yo para que no hayan problemas) 
-> http://kawaiiososekai.blogspot.com/
Chaito♥

Menu Simples ♥ *CLIK*

Hi! Konichiwa Kawaii's ¿Come están Yo super !
El dia les traigo este Tutorial Padrisimo de SECCION ; *Recursos* para su blog xD
que es un menú sencillo con Imagen estaría bueno para una plantilla jajajajajaj x3
Esta genial Por que es una imagen que esta como base & Luego el Menu con Gifs Minis xd
Okiis Empezemos

Nos vamos a Diseño --> Añadir gadget ---> HTML JavaScript & copias con CTRL C & Pegas con CTRL V ... & Damos e n cuargar el siguiente Codigo ;

<center><div style="background:url(URL DE TU BACKGROUND);width:210px;border:2px solid #ccc;padding:5px;"><a href="URL DE TU BLOG">hOME</a> <img src="http://www.drikoti.net/Dri/CuteChibbi/bolinha-rosa.gif"/> <span id="goog_1755542995"></span><a href="URL DE TU ENTRADA">TUTURIAL</a> <span id="goog_1755542996"></span><img src="http://www.drikoti.net/Dri/CuteChibbi/bolinha-rosa.gif"/> <a href="URL DE TU ENTRADA">CREDITOS</a> <img src="http://www.drikoti.net/Dri/CuteChibbi/bolinha-rosa.gif"/></center>

Rosa: Url o direccion de tu fondo

Azul: Lo grueso del borde, el tipo de borde y el color del borde

Naranja: Direcciones de tus entradas

Lila: El titulo de tu entrada

verde: Direccion de tu gif.

 

& Listo! Jajajajaj Utilizenlo es sin Creditos ... Bueno nos vemos en el Proximo Tutorial

Atte ..

                                  Sr. Diniie-Chan