jueves, 22 de noviembre de 2007

Menu Horizontal II

Encontre un menu horizontal muy facil de implementar en nuestro Blog...
Veamos...


1. Copiar en siguiente codigo entre ]]></b:skin> y </head>

<style type='text/css'>
.hovermenu ul{
font: bold 13px arial;
padding-left: 0;
margin-left: 0;
height: 20px;
}
.hovermenu ul li{
list-style: none;
display: inline;
}
.hovermenu ul li a{
padding: 2px 0.5em;
text-decoration: none;
float: left;
color: yellow;
background-color: #125483;
border: 2px solid #FFF2BF;
}
.hovermenu ul li a:hover{
background-color: #FFE271;
border-style: outset;
}

html&gt;body .hovermenu ul li a:active{ /* Apply mousedown effect only to NON IE browsers */
border-style: inset;
}
</style>

( Lo que se encuentra en rojo se puede cambiar por los colores que combinen con la platilla )

Guardamos los cambios

2. Ir a Plantilla/Elementos de la pagina/Añadir un elemento de pagina y pegar el siguiente codigo...

<div class="hovermenu">

<ul>

<li><a href="http://tublog.com">inicio</a></li>

<li><a href="http://www.pagina1.com">pagina1</a></li>

<li><a href="http://www.pagina2.com">pagina2</a></li>

<li><a href="http://www.pagina3">pagina3</a></li>

<li><a href="http://www.pagina4.com">pagina4</a></li>

</ul>

</div>


y guardar cambios...



lucky...



No hay comentarios:


Music