![[punBB / phpBB2] Dropdown menu con CSS. 2V2SM5G](https://2img.net/h/i.imgur.com/2V2SM5G.png)
1![[punBB / phpBB2] Dropdown menu con CSS. Empty](https://2img.net/i/empty.gif)
[punBB / phpBB2] Dropdown menu con CSS. Dom Mayo 13, 2012 9:36 am
Michael Scofield
Mensajes : 110 
Monedas : 177 CLICK AQUI PARA VER DEMO.
Lo primero que vamos a hacer es crear la estructura HTML y luego la agregamos en "Panel de Administración > Visualizacion > Templates > General: overall_header" y colocamos el siguiente codigo HTML al principio del template.
Lo primero que vamos a hacer es crear la estructura HTML y luego la agregamos en "Panel de Administración > Visualizacion > Templates > General: overall_header" y colocamos el siguiente codigo HTML al principio del template.
- Código:
http://es.scribd.com/doc/93378983
Ahora vamos a darle efecto con CSS. "Panel de Administración > Visualizacion > Imagenes y Colores > Colores > CSS Stylesheet" y pegamos lo siguiente:
- Código:
#nav, #nav ul{
margin:0;
padding:0;
list-style-type:none;
list-style-position:outside;
position:relative;
line-height:1.5em;
}
#nav a:link, #nav a:active, #nav a:visited{
display:block;
padding:0px 5px;
border:1px solid #333;
color:#fff;
text-decoration:none;
background-color:#333;
}
#nav a:hover{
background-color:#fff;
color:#333;
}
#nav li{
float:left;
position:relative;
}
#nav ul {
position:absolute;
width:12em;
top:1.5em;
display:none;
}
#nav li ul a{
width:12em;
float:left;
}
#nav ul ul{
top:auto;
}
#nav li ul ul {
left:12em;
margin:0px 0 0 10px;
}
#nav:hover ul ul, #nav li:hover ul ul ul, #nav li:hover ul ul ul ul{
display:none;
}
#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li li li li:hover ul{
display:block;
}
Y listo.
Tutorial y codigo adaptado a foroactivo por Noam Chomsky, prohibida su distribucion sin notificarme.
