Foros del Web » Creando para Internet » CSS »

utilizar varias class a un mismo elemento

Estas en el tema de utilizar varias class a un mismo elemento en el foro de CSS en Foros del Web. Hola... tengo definida una clase para todos los link Código: a:link, a:visited { color: #000000; text-decoration: none; } a:hover { color: #C0C0C0; text-decoration: underline; } ...
  #1 (permalink)  
Antiguo 01/04/2005, 14:52
 
Fecha de Ingreso: mayo-2004
Mensajes: 159
Antigüedad: 13 años, 6 meses
Puntos: 0
utilizar varias class a un mismo elemento

Hola...

tengo definida una clase para todos los link
Código:
a:link, a:visited {
	color: #000000;
	text-decoration: none;
}

a:hover {
	color: #C0C0C0;
	text-decoration: underline;
}

a:active {
	color: #FF0000;
	text-decoration: underline;
}
pero a su vez quiero que un enlace en particular utilice otra clase
Código:
.sideboxcontent {
	background-color: #FFDE5F;
	border-bottom: 1pt  #000000;
	border-top: 1pt  #000000;
	height: 15pt;
	text-align: center;
	text-decoration: none;
	vertical-align: middle;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: 800;
	font-size: 10px;
	letter-spacing: 0px;
	color: #000000;
}
pero el enlace que hago <a class=sideboxcontent... siempre me toma los valores de .a

qué puedo hacer
  #2 (permalink)  
Antiguo 01/04/2005, 16:29
Avatar de PatomaS
Colaborador
 
Fecha de Ingreso: marzo-2004
Ubicación: En alguna otra parte
Mensajes: 4.656
Antigüedad: 13 años, 9 meses
Puntos: 63
Hola

Aunque bastaría con que escribieras la clase debajo de las definiciones de los vínculos generales, hay otro método más elegante.

Código:
#sideboxcontent {
	background-color: #FFDE5F;
	border-bottom: 1pt  #000000;
	border-top: 1pt  #000000;
	height: 15pt;
	text-align: center;
	text-decoration: none;
	vertical-align: middle;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: 800;
	font-size: 10px;
	letter-spacing: 0px;
	color: #000000;
}
...
<a id="sideboxcontent"...
Con esto debería bastar.

Felicidad
__________________
¡ hey, hou, hou, hey !
  #3 (permalink)  
Antiguo 01/04/2005, 17:43
 
Fecha de Ingreso: diciembre-2003
Mensajes: 1.583
Antigüedad: 14 años
Puntos: 13
a.sideboxcontent:link {
background-color: #FFDE5F;
border-bottom: 1pt #000000;
border-top: 1pt #000000;
height: 15pt;
text-align: center;
text-decoration: none;
vertical-align: middle;
font-family: Arial, Helvetica, sans-serif;
font-weight: 800;
font-size: 10px;
letter-spacing: 0px;
color: #000000;
}

Si no le dices al CSS que la clase sideboxcontent se la quieres aplicar a un link (a), ese link seguirá tomando los valores que has dado en el a:link general
__________________
El conocimiento es libre: Movimiento por la Devolución
  #4 (permalink)  
Antiguo 04/04/2005, 13:18
Ex Colaborador
 
Fecha de Ingreso: junio-2002
Mensajes: 9.091
Antigüedad: 15 años, 6 meses
Puntos: 16
Hola,

No soy ningun experto en CSS, pero se que le pusieron el nombre de Cascade Style Sheet porque se aplican los estilos en cascada. El orden de aplicacion viene en http://www.w3.org/TR/CSS21/cascade.html#cascade, y se puede usar !important para "saltarse" ese orden. Asi que en teoria:
Código HTML:
<style>
a:link, a:visited {
	color: #000000;
	text-decoration: none;
}

a:hover {
	color: #C0C0C0;
	text-decoration: underline;
}

a:active {
	color: #FF0000;
	text-decoration: underline;
}
.sideboxcontent {
	background-color: #FFDE5F;
	border-bottom: 1pt  #000000;
	border-top: 1pt  #000000;
	height: 15pt;
	text-align: center;
	text-decoration: none !important;
	vertical-align: middle;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: 800;
	font-size: 10px;
	letter-spacing: 0px;
	color: #000000 !important;
}
</style>
</head>
<body>
<a class=sideboxcontent href="#">enlace</a>
</body>
</html> 
deberia servir. Creo que ademas es mejor, porque la definicion de .sideboxcontent solo esta en una sola para que solo haya un punto de cambio.

Saludos.

PD: Aunque creo que es mala idea que los links no sean distintos al texto, yo por lo menos les dejaria el text-decoration a underline.
__________________
Josemi

Aprendiz de mucho, maestro de poco.
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




La zona horaria es GMT -6. Ahora son las 21:45.