Cambiar el color de fondo de una tabla en la Web

Cambiar el color de fondo de una tabla en la Web

Cambiar el color de fondo de una tabla en la Web

VALORACIÓN DEL ARTÍCULO:
5/5


El método para cambiar los colores de fondo de las partes de una tabla en un sitio web ha cambiado con los años, siendo más fácil y menos intensivo en mano de obra con la introducción de hojas de estilo.

El método anterior usaba el atributo bgcolor para cambiar el color de fondo de una tabla. También se puede utilizar para cambiar el color de una fila de tabla o de una celda de tabla. Pero el atributo bgcolor ha sido desaprobado en favor de las hojas de estilo, por lo que no es la forma óptima de manipular el color de fondo de una tabla.

La mejor manera de cambiar el color de fondo es añadir la propiedad style background-color a la etiqueta de tabla, fila o celda.

Este ejemplo cambia el color de fondo de toda una tabla:

Para cambiar el color de una sola fila, inserte la propiedad de color de fondo en la etiqueta :

Puede cambiar el color de una sola celda añadiendo el atributo a la etiqueta :

También puede aplicar colores de fondo a los cabezales de las tablas, o a la etiqueta de la misma manera:

Cambiar el color de fondo usando hojas de estilo

Es mejor, sin embargo, evitar usar el atributo del color de fondo en favor de una hoja de estilo correctamente formateada. Por ejemplo, puede definir los estilos en una hoja de estilo en el ENCABEZAMIENTO de su documento HTML o en una hoja de estilo externa. Cambios como estos en el HEAD o en una hoja de estilo externa pueden aparecer como estos para tablas, filas y celdas:

table { color de fondo: #ff0000; }
tr { color de fondo: amarillo; }
td { color de fondo: #000; }

Configuración del color de fondo de la columna

La mejor manera de establecer el color de fondo para una columna es crear una clase de estilo y luego asignar esa clase a las celdas de esa columna. Crear una clase le permite asignar esa clase a las celdas de una columna específica utilizando un atributo.

El CSS :

El HTML :

celda 1, celda 2, celda 3, celda 3, celda 4, celda 4, celda 4, celda 5, celda 5, celda 5, celda 5, celda 5.celda 1, celda 2, celda 3, celda 3, celda 4, celda 4, celda 4, celda 5, celda 5, celda 5, celda 5, celda 5.  

Una ventaja significativa de controlar los colores de fondo a través de una hoja de estilo es que usted puede cambiar su elección de color en un momento posterior. En lugar de tener que pasar por el documento HTML y hacer el cambio a cada una de las celdas, puede hacer un solo cambio en la elección de color en el CSS que se aplicará inmediatamente a cada instancia en la que aparezca la sintaxis.

Aunque intercalar CSS en su HTML, o llamar a un archivo CSS separado, añade un poco de carga administrativa más allá de simplemente modificar un atributo HTML, encontrará que confiar en CSS reduce los errores, acelera el desarrollo y mejora la portabilidad de su documento.

TAMBIÉN TE INTERESA

Nothing Phone (3)

Otra vez que nos deja en shock: se presenta el Nothing Phone (3)

Siempre causa mucha expectativa el lanzamiento de productos por parte de quien suele hacer las cosas diferentes. Y ese alguien en la industria de los smartphones es Nothing. Tecnonautas siempre ha seguido muy de cerca todo lo que ha salido de esta firma, simplemente por funcionar y por ser diferente al resto. Y ahora llega

Inteligencia Artificial Generativa y deporte

Inteligencia Artificial Generativa y deporte: una relación que va tomando forma…

El deporte, tradicionalmente anclado en la emoción del directo en la televisión en directo en los estadios, está entrando en una nueva era digital, profundamente influenciada por la inteligencia artificial (IA). Inteligencia Artificial Generativa y deporte están yendo de la mano y es la relación del momento para las generaciones jóvenes. Así lo concluye el

vivo X200 FE

Vivo X200 FE: fuera caretas con esta nueva gama alta

La marca vivo, siempre muy identificada con móviles accesibles, se quita la carea para presentar el nuevo vivo X200 FE, un dispositivo que busca conquistar a los usuarios que quieren rendimiento premium sin renunciar a la comodidad. Con una cámara desarrollada junto a ZEISS, batería de larga duración, una pantalla de alto nivel y un

videovigilancia camara AOV PT

La cámara AOV PT: un motivo para irse tranquilo de vacaciones

El verano es sinónimo de descanso, desconexión y viajes. Pero también de preocupación y seguro que las siglas de la cámara AOV PT ayudan a combatir ese sentimiento. Casas vacías, negocios con menos actividad y propiedades que quedan fuera del radar diario se convierten en un blanco fácil para robos o actos vandálicos. En este