Haber...pues no comprendo lo de herencia de las clases...cuando te refieres a esta parte
Código:
#inicio a ul li a{background: none;}
#inicio a ul li a:hover{background: none;}
#inicio a ul li a:active{background: none;}
Pues lo que tengo es esto...que es donde pongo las imagenes como fondo de los menus, pero como hago para hacer referencia a los submenus? porque creo que si pongo como tu dices quedaria asi...
Código:
@charset "utf-8";
/* CSS Document */
* {
margin:0;
padding:0;
}
body {
min-width: 680px;
background: #999;
padding:10px;
}
#cabecera {
background: #eee;
}
#titulo {
height:75px;
background:#ccc;
}
div#menu {
float: left;
}
#menu li {
float:left;
position:relative;
list-style:none;
}
#inicio a{background-image:url(bot1.jpg); width:245px; height:51px;}
#inicio a:hover{background:url(bot1.jpg) left 51px;}
#inicio a:active{background:url(bot1.jpg) left 51px;}
#propiedades a{background-image:url(bot2.jpg); width:221px; height:51px;}
#propiedades a:hover{background:url(bot2.jpg) left 51px;}
#propiedades a:active{background:url(bot2.jpg) left 51px; }
#arquitectura a{background-image:url(bot3.jpg); width:137px; height:51px;}
#arquitectura a:hover{background:url(bot3.jpg) left 51px;}
#arquitectura a:active{background:url(bot3.jpg) left 51px; }
#tasaciones a{background-image:url(bot4.jpg); width:130px; height:51px;}
#tasaciones a:hover{background:url(bot4.jpg) left 51px;}
#tasaciones a:active{background:url(bot4.jpg) left 51px; }
#contacto a{background-image:url(bot5.jpg); width:217px; height:51px;}
#contacto a:hover{background:url(bot5.jpg) left 51px; }
#contacto a:active{background:url(bot5.jpg) left 51px; }
#inicio a ul li a{background: none;} /*.......igualmente no funciona porque sigue heredando las imagenes......*/
#inicio a ul li a:hover{background: none;}
#inicio a ul li a:active{background: none;}
#propiedades a ul li a{background: none;}
#propiedades a ul li a:hover{background: none;}
#propiedades a ul li a:active{background: none;}
/*.............etc etc etc...para los demas casos......*/
div#menu a {
display:block;
text-decoration:none;
}
div#menu ul li ul {
position:absolute;
}
div#menu ul li ul li {
border:1px 1px 1px 1px solid #069;
}
body div#menu ul li ul {
display:none;
}
div#menu ul li:hover ul, div#menu ul li ul:hover {
display:block;
}
O donde es que debo modificar esto? proque si lo modifico donde dice esto...
Código:
#inicio a{background-image:url(bot1.jpg); width:245px; height:51px;}
#inicio a:hover{background:url(bot1.jpg) left 51px;}
#inicio a:active{background:url(bot1.jpg) left 51px;}
no va a poner las imagenes como fondo...