Foros del Web » Creando para Internet » HTML »

Como cambiar el color de fondo de un tabla?

Estas en el tema de Como cambiar el color de fondo de un tabla? en el foro de HTML en Foros del Web. Buenas!! Una pregunta rapidilla que me preguntaba yo.... Hay alguna forma mediante estilos o HTML de que al pasar el ratón por una celda de ...
  #1 (permalink)  
Antiguo 17/11/2005, 14:16
Avatar de crcbad  
Fecha de Ingreso: enero-2005
Mensajes: 302
Antigüedad: 12 años, 11 meses
Puntos: 0
Como cambiar el color de fondo de un tabla?

Buenas!! Una pregunta rapidilla que me preguntaba yo....

Hay alguna forma mediante estilos o HTML de que al pasar el ratón por una celda de una tabla, por ejemplo, tiene 8 celdas, que al pasar el raton se ponga un fondo esa celda y al quitar el ratón que se quede como inicialmente estaba?

Podria hacer 8 onmouseover por cada celda... pero me preguntaba si hay alguna forma mas sencilla por html o css.

Gracias ;)
__________________

:cool: [ http://eruben.sytes.net ] :cool:


Las dos frases que te ayudarán a salir adelante:
  • No hay mujer fea, solo copas de menos. :borracho:
  • Ante la duda, siempre coge la más tetuda. :arriba:
  #2 (permalink)  
Antiguo 17/11/2005, 14:43
Avatar de carbalga  
Fecha de Ingreso: octubre-2005
Ubicación: Coronado, Costa Rica
Mensajes: 138
Antigüedad: 12 años, 1 mes
Puntos: 1
Saludos

Mira esto se hace con DREAMWEAVER y con una extension que se llama: OBJECT COLOR CHANGER de PVII es gratis y funciona en Dreamweaver 4, MX, MX 2004 y 8.

Prueba el siguiente codigo:

Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script type="text/JavaScript">
<!--
function pviiW3Cbg(obj, pviiColor) { //v1.1 by Project VII
	obj.style.backgroundColor=pviiColor
}
//-->
</script>
</head>

<body>
<table width="150" height="30" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td align="center" valign="middle" bgcolor="#FF9933" onmouseover="pviiW3Cbg(this, '#FF0000')" onmouseout="pviiW3Cbg(this, '#FF9933')">1</td>
  </tr>
  <tr>
    <td align="center" valign="middle" bgcolor="#FF9933" onmouseover="pviiW3Cbg(this, '#FF0000')" onmouseout="pviiW3Cbg(this, '#FF9933')">2</td>
  </tr>
  <tr>
    <td align="center" valign="middle" bgcolor="#FF9933" onmouseover="pviiW3Cbg(this, '#FF0000')" onmouseout="pviiW3Cbg(this, '#FF9933')">3</td>
  </tr>
  <tr>
    <td align="center" valign="middle" bgcolor="#FF9933" onmouseover="pviiW3Cbg(this, '#FF0000')" onmouseout="pviiW3Cbg(this, '#FF9933')">4</td>
  </tr>
  <tr>
    <td align="center" valign="middle" bgcolor="#FF9933" onmouseover="pviiW3Cbg(this, '#FF0000')" onmouseout="pviiW3Cbg(this, '#FF9933')">5</td>
  </tr>
  <tr>
    <td align="center" valign="middle" bgcolor="#FF9933" onmouseover="pviiW3Cbg(this, '#FF0000')" onmouseout="pviiW3Cbg(this, '#FF9933')">6</td>
  </tr>
  <tr>
    <td align="center" valign="middle" bgcolor="#FF9933" onmouseover="pviiW3Cbg(this, '#FF0000')" onmouseout="pviiW3Cbg(this, '#FF9933')">7</td>
  </tr>
  <tr>
    <td align="center" valign="middle" bgcolor="#FF9933" onmouseover="pviiW3Cbg(this, '#FF0000')" onmouseout="pviiW3Cbg(this, '#FF9933')">8</td>
  </tr>
</table>
</body>
</html> 
BUENA SUERTE
__________________
SBC Studio
www.sbcstudio.com
| Aplicaciones Web - Costa Rica |
[email protected]
  #3 (permalink)  
Antiguo 18/11/2005, 02:46
Avatar de KarlanKas
Moderador extraterrestre
 
Fecha de Ingreso: diciembre-2001
Ubicación: Madrid
Mensajes: 6.987
Antigüedad: 16 años
Puntos: 60
Esto funcionaría con cualquier navegador que no sea IE:

Código PHP:
<html>
<
head>
<
title>Untitled</title>
<
style>
table{
background:#ffcc66;
}
td{background:#ffffcc;
font:normal 10px/10px verdana;
padding:5px;}
td:hover{background:#ffff66;}
</style>
</
head>

<
body>

<
table>
<
tr><td>pepepe</td><td>pepepe</td><td>pepepe</td></tr>
<
tr><td>pepepe</td><td>pepepe</td><td>pepepe</td></tr>
<
tr><td>pepepe</td><td>pepepe</td><td>pepepe</td></tr>
<
tr><td>pepepe</td><td>pepepe</td><td>pepepe</td></tr>
<
tr><td>pepepe</td><td>pepepe</td><td>pepepe</td></tr>
<
tr><td>pepepe</td><td>pepepe</td><td>pepepe</td></tr>

</
table>

</
body>
</
html
Está hecho con CSS.
__________________
Cómo escribir

No hay pregunta tonta, sino tonto que quiere seguir en la ignorancia.
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 05:34.