Gustavo.DiazSalazar.com.mx

Cambio IX

Filed under Sin Categoria

Previos:
Cambio I, Cambio II, Cambio III, Cambio IV, Cambio V, Cambio VI, Cambio VII, Cambio IX.
Continuemos con la remodelación del Blog, continuemos con el menú, hay en la Web varis paginas que nos ayudan a genera menús con estilos CSS, aquí listo varios ejemplos de ellos, a los cuales le tenemos que proporcionar algunos parámetros y con ello obtenemos un código que podemos adaptar a lo que deseamos hacer, algunos de ellos son:

CSS Menu Generator :: Webmaster Toolkit
Free Menu Designs – e-lusion.com
Dashed Vertical Menu
JK Cool CSS Menu
CSS Drive vertical menu links
css.maxdesign.com.au

h1,h2,p{
margin: 10px
}

p{
padding-bottom:1em
}

div#nifty{
width: 95%;
color: #ffffff;
margin: 0 ;
background: #154164
}

div#nifty a{
color: #ffffff;
}

div#nifty a:hover{
color: Gray;
font: bold;
}

b.rtop, b.rbottom{
display:block;
background: #FFF
}

b.rtop b, b.rbottom b{
display:block;
height: 1px;
overflow: hidden;
background: #154164
}

b.r1{
margin: 0 5px
}

b.r2{
margin: 0 3px
}

b.r3{
margin: 0 2px
}

b.rtop b.r4, b.rbottom b.r4{
margin: 0 1px;
height: 2px
}

y el código en cada una de las secciones del menús seria así:

<div id=”nifty”>
< b class=”rtop”><b class=”r1″></b><b class=”r2″></b><b
class=”r3″></b><b class=”r4″></b></b>

[Aquí el sección]

<b class=”rbottom”><b class=”r4″></b><b
class=”r3″></b><b class=”r2″></b><b
class=”r1″></b></b></div>

Así quedaría después de las modificaciones.

Saludos.