Foros del Web » Creando para Internet » CSS »

Herencia con CSS

Estas en el tema de Herencia con CSS en el foro de CSS en Foros del Web. Buenas a todos/as Tengo una clase botón en un archivo CSS y necesito que herede todas sus características pero NO el hover. Pongo un ejemplo: ...
  #1 (permalink)  
Antiguo 14/08/2007, 05:44
 
Fecha de Ingreso: noviembre-2005
Ubicación: Alicante (España)
Mensajes: 242
Antigüedad: 12 años
Puntos: 1
Herencia con CSS

Buenas a todos/as

Tengo una clase botón en un archivo CSS y necesito que herede todas sus características pero NO el hover.
Pongo un ejemplo:

Este es mi código del CSS:

.boton{
padding: 3px;
background-image: url(../BtnOff/BtnEmpresa.gif);
background-repeat:no-repeat;
width:99px;
height:25px;
text-decoration:none;
}

.boton:hover{
padding: 3px;
background-image: url(../BtnOn/BtnEmpresaAct.gif);
background-repeat:no-repeat;
width:99px;
height:25px;
text-decoration:none;
}


Necesito una clase nueva con el mismo comportamiento pero con una imagen de fondo distinta:

.boton2{
background-image: url(../BtnOff/BtnCatalogo.gif);
}

.boton2:hover{
background-image: url(../BtnOn/BtnCatalogoAct.gif);
background-repeat:no-repeat;
width:99px;
height:25px;
text-decoration:none;
}


Si utilizo la clase boton desde el html no hay problema y todo funciona bien:
<a href="PantallaC.html" class="boton">&nbsp</a>

Pero cuando utilizo la clase boton2 y HEREDO de la clase boton, adquiere todas las características (lo cual lo veo perfecto) PERO también adquiere el comportamiento hover... No hace caso del hover del boton2 y eso no es lo que quiero.

<a href="PantallaC.html" class="boton boton2">&nbsp</a>

¿Alguien sabe como podría resolver esto sin tener que escribir las propiedades para uno y para otro?... Me gustaría usar la herencia del boton pero que el boton2 tenga el comportamiento hover del boton2:hover...

Última edición por Tarzan; 14/08/2007 a las 07:20
  #2 (permalink)  
Antiguo 14/08/2007, 13:35
AlvaroG
Invitado
 
Mensajes: n/a
Puntos:
Re: Herencia con CSS

Pues lo veo más simple así:

Código:
.boton, .boton2 {
padding: 3px;
background-repeat:no-repeat;
width:99px;
height:25px;
text-decoration:none;
}

.boton {
background-image: url(../BtnOff/BtnEmpresa.gif);
}

.boton2{
background-image: url(../BtnOff/BtnCatalogo.gif);
}
Y como antes los :hover especificados para cada una.

Luego simplemente ponés
Código:
<a href="PantallaC.html" class="boton2">&nbsp</a>

Saludos.
  #3 (permalink)  
Antiguo 16/08/2007, 01:11
 
Fecha de Ingreso: noviembre-2005
Ubicación: Alicante (España)
Mensajes: 242
Antigüedad: 12 años
Puntos: 1
Re: Herencia con CSS

Muchísimas gracias Alvlin!!!


Eso era exactamente lo que buscaba!!


Un saludo.
  #4 (permalink)  
Antiguo 19/08/2010, 15:23
 
Fecha de Ingreso: junio-2010
Mensajes: 12
Antigüedad: 7 años, 6 meses
Puntos: 0
Respuesta: Herencia con CSS

También lo que yo estaba buscando, genial! Gracias Alvlin!
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta

SíEste tema le ha gustado a 1 personas




La zona horaria es GMT -6. Ahora son las 02:16.