Foros del Web » Creando para Internet » CSS »

Cambiar fondo de tabla

Estas en el tema de Cambiar fondo de tabla en el foro de CSS en Foros del Web. Saludos Foreros. Acabo de iniciarme con esto de CSS y he estado viendo la posibilidad de cambiar el color de fondo o imagen de una ...
  #1 (permalink)  
Antiguo 01/11/2004, 15:46
Avatar de hentai_nation  
Fecha de Ingreso: diciembre-2003
Mensajes: 377
Antigüedad: 14 años
Puntos: 0
Cambiar fondo de tabla

Saludos Foreros.

Acabo de iniciarme con esto de CSS y he estado viendo la posibilidad de cambiar el color de fondo o imagen de una tabla al pasar el cursor por encime de el, y una vez que se quite el cursor, que regrese a la forma en que estaba antes.

He encontrado que poniendo el codigo directo en el HTML si lo puedo hacer, pero yo quiero hacerlo en una CSS separada, es decir, un archivo que contenga la instruccion, para no mezclar el codigo con el HTML original.

El codigo es este:

<TR>
<TD onmouseover="this.style.backgroundColor='#b0b0b0'; "
onmouseout="this.style.backgroundColor='#9b9b9b';"
background="test.htm"
bgColor=#9b9b9b>&nbsp;</TD>
</TR>

Espero puedan ayudarme una vez mas.

Gracias desde ya.
__________________
Adun Torid Us
Proud Linux Mandrake User.
:policia:
  #2 (permalink)  
Antiguo 01/11/2004, 16:05
Avatar de jesusbet
(Desactivado)
 
Fecha de Ingreso: mayo-2004
Ubicación: Monterrey, MX
Mensajes: 2.667
Antigüedad: 13 años, 7 meses
Puntos: 2
Pues puedes hacer una función en javascript, archivarlo en un archivo js y llamarlo como lo haces tú; en css podrías usar el hover, por ejemplo:

.class_de_tabla {
background-color: #000000;
}

.class_de_tabla:hover {
background-color: #ffffff;
}

Eso debería funcionar.

Saludos
  #3 (permalink)  
Antiguo 01/11/2004, 19:09
Avatar de Manoloweb  
Fecha de Ingreso: enero-2002
Ubicación: Monterrey
Mensajes: 2.454
Antigüedad: 15 años, 10 meses
Puntos: 5
Desafortunadamente IE y otros navegadores no reconocen el pseudo-elemento :hover en ninguna otra cosa que no sea un link <a>.

Así que lo mas cercano a eso, es lo siguiente...

Mete en cada celda un elemento <a>, y luego a ese elemento dale la característica de display:block para que ocupe todo el espacio de la celda. Incluso puedes especificar un height...

Sobre ese elemento, puedes hacer ya tu :hover, :visited y demás para conseguir tu efecto sin javascript, sin hacks ( a menos que meter el <a> se considere uno [?]), y compatible con la mayoría de los browsers.

__________________
Manoloweb
  #4 (permalink)  
Antiguo 02/11/2004, 15:39
Avatar de iconogt  
Fecha de Ingreso: septiembre-2004
Ubicación: Guatemala
Mensajes: 573
Antigüedad: 13 años, 3 meses
Puntos: 4
Hola a todos,

Muy buen truquillo el de Manoloweb No se me había ocurrido y ya estaba por hacer la pregunta

Muchas gracias Manoloweb por tu aporte,
Slds..
__________________
_______
Jorge Rojas.
  #5 (permalink)  
Antiguo 09/02/2005, 12:43
 
Fecha de Ingreso: febrero-2005
Ubicación: bcn - catalunya
Mensajes: 107
Antigüedad: 12 años, 10 meses
Puntos: 0
Gracias Manoloweb!! Muy Buena Solución!
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 22:33.