relojes blogs

15.10.10

Menú horizontal muy interesante


Comparte esta historia en:

El otro día buscando un menú que no fuese muy complicado de poner me tropecé con este en el blog de Gema, bueno con este en concreto no, este está ya muy retocado por mi (espero que no le moleste a nadie) era uno parecido, total que lo coloqué en un blog y ahí está, queda bastante bien.

Si quieres llevártelo vamos a empezar.

Entramos en Diseño, Editar HTML y buscamos ]]></b:skin> y una vez localizado ponemos justo encima este código:

#navigation {
margin-:100px; /* Margen izquierdo */
top:25px; /* Margen superior */
}
#navigation li {
float:left;
}
#navigation a {
background-color:#fff2cc; /* color de fondo */
border-bottom:3px solid #990000; /* Línea inferior *
color:#FFFFFF; /* Color de texto */
display:inline-block;
font-size:10px; /* Tamaño de fuente */
font-weight:normal;
margin-right:1px;
padding:2px 8px 2px; /* Anchura y altura de las pestañas */
text-decoration:none;
text-transform:uppercase; /* Letra mayúscula */
text-shadow:0 1px 1px #CDCDCD ;/* Sombra texto */
}
#navigation a:hover {
border-bottom:3px solid #000000; /* Linea inferior al pasar el cursor (hover) */
color:#990000; /* Color al pasar el cursor (hover) */
}
#navigation li.selected a {
border-bottom:3px solid #05C7C0; /* Color linea inferior fija (Home) */
color:#05C7C0; /* Color texto fijo (Home) */
}
#navigation ul {
list-style-image:none;
list-style-position:outside;
list-style-type:none;
margin:0;
padding:0;
}


En color Naranja lo que puedes modificar

Guardamos la plantilla y nos vamos a Diseño, Añadir un gadget y abrimos un HTML javascript, ahí pegamos lo siguiente:

<div align="left">
<div id='navigation'>
<ul>
<li><a href='URL PAGINA'>HOME</a></li>
<li><a href='URL PAGINA'>TITULO</a></li>
<li><a href='URL PAGINA'>TITULO</a>
<li><a href='URL PAGINA'>TITULO</a></li>
<li><a href='URL PAGINA'>TITULO</a></li>
<li><a href='URL PAGINA'>TITULO</a></li>
</li></ul></div></div>

Listo, ya tienes el menú. Si tienes alguna duda deja un comentario.

0 Comentarios :

¿Quieres comentar algo?




Estado del blog

entradas
comentarios
1.467 followers
168 seguidores
 días online



Comentarios recientes

 
© Copyright 2009 - 2015 | Contacto | Seguir este blog | Sobre mi | Facebook | Twitter | LinkedIn | Mapa del sitio | Tienda | Conversor | RSS |

@duque71 2015