10 de junio de 2012

Menú vertical

¿ Queréis saber como hacer para poner un menú vertical en el blog ? Pues no dejéis de leer que empezamos.


*Entra en diseño y en edición html, seguido le das a CTRL F y os saldrá un cuadrito de este estilo o más pequeño.


*En el cuadrito buscad lo siguiente : ]]></b:skin>
Y cuando aparezca, poner antes de ]]></b:skin> poner esto otro :


/* Menú Vertical
----------------------------------------------- */
#menuvert ul {
list-style-type: none;
margin: 0px;
padding: 0px;
width: 200px; /* ancho del menú */
font-size: 11pt;
}
#menuvert ul li {
background-color: #B0CBDD; /* color de fondo del menú */
padding: 0px;
}
#menuvert ul li a {
color: #000; /* color de las letras */
text-decoration: none;
display: block;
padding: 10px 10px 10px 20px;
}
#menuvert ul li a:hover {
background: #336699; /* color del botón al pasar el cursor */
border-left: 10px solid #000066; /* color del rectángulo junto al título */
color: #FFFFFF; /* color de las letras al pasar el cursor */
}

( Podéis personalizar con los colores que queráis )


*Entrar en diseño y a añadir un gadget, html/javascript y pon lo siguiente:


<div id="menuvert">
<ul>
<li><a href="URL del enlace">Título 1</a></li>
<li><a href="URL del enlace">Título 2</a></li>
<li><a href="URL del enlace">Título 3</a></li>
<li><a href="URL del enlace">Título 4</a></li>
</ul>
</div>

Y listo le das a guardar y ya lo deberíais tener listo.


0 comentarios:

Publicar un comentario