Tema: Menu Css
Ver Mensaje Individual
  #3 (permalink)  
Antiguo 18/05/2008, 12:03
Avatar de Marcos071
Marcos071
 
Fecha de Ingreso: enero-2006
Ubicación: Presidencia Roque Sáenz Peña - Chaco
Mensajes: 384
Antigüedad: 18 años, 3 meses
Puntos: 5
Respuesta: Menu Css

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...