MENU VERTICAL

Publicat per Rosy , Etiquetes de comentaris: dilluns, 20 de febrer del 2012 12:38

Alguna de vosaltres m'ha comentar de poder posar un menú vertical per tal d'unir els blogs del cicle . Un exemple seria el de la imatge; pràctic i senzill, que en dieu?




Només has d'anar a: Diseño>Elementos de la página.


Afegeix un nou ElementoHTML,preferiblement a la sidebar, y pega el següent codi:


  .................
<div id="menuvertical-trucoteca">
< ul id="menuv">
<li><a href="#">Inicio</a></li>
<li><a href="#">Acerca de</a></li>
<li><a href="#">Enlazar</a></li>
<li><a href="#">Contacto</a></li>
< /ul>
< /div>
< style type="text/css">
#menuv {
float:left;
}
#menuv li {
background: url(http://i825.photobucket.com/albums/zz180/latrucoteca/Degradadomini2.png);
margin:6px;
padding:3px;
border:1px solid #08088A;
width: 150px;
text-align:center;
font-family: Segoe UI, Arial;
font-size: 14px;
}
#menuv li:hover {
background: url(http://i825.photobucket.com/albums/zz180/latrucoteca/Degradadomini2.png);
border:1px solid #08088A;
filter:alpha(opacity=80);
-moz-opacity: 0.8;
opacity: 0.8;
-khtml-opacity: 0.8;
}
#menuv a:hover {
color: #ffffff;
text-decoration: none;
font-weight: bold;
}
#menuv a {
color: #ffffff;
< /style>
  .................
Si vols afegir un nou enllaç en el menú, solament has de copiar i pegar (tantes vegades com necessitis) la línia que aquesta en negreta. Quedaria alguna cosa així:
 .................
<li><a href="#">Enlazar</a></li>
<li><a href="#">Contacto</a></li>
<li><a href="#">El títol que vulguis</a></li>
.................
Ara , només has de personalitzar els enllaços i els títols; per a això canvia el # per la direcció a la qual enllaci, i els títols  Inicio - Acerca de - Enlazar - Contacto - etc. per les paraules que vulguis. Guarda els canvis...... i ........LLEST!

Labels

Quants hem entrat?

contador de visitas
contador de visitas