Elemento colgroup en HTML

El elemento html colgroup define un conjunto de columnas dentro de una tabla.

Para ver un ejemplo del uso de elementos , consulte la página de elementos

y elementos .

Etiqueta html colgroup

se pone a cero una o más veces. no está precedido por un elemento cuya etiqueta de cierre se haya eliminado. La etiqueta de cierre se puede omitir si este elemento no va seguido de un espacio o comentario. con CSS, tenga en cuenta las siguientes ideas al formatear este elemento:

No intente usar la propiedad text-align en un selector para

ese elemento porque los elementos no heredarán este formato.

Si no muestra los elementos de la propiedad en la tabla colspan, use el especificado td:nth-child(an+b)‎y establezca a en cero yb en la posición de la columna en la tabla, por ejemplo , td:nth-child(2) ‎{ text-align: right; }‎para alinear el contenido de la segunda columna a la derecha.

Si los elementos de la tabla tienen la propiedad colspan, los selectores CSS se pueden usar de manera similar a [colspan=n].

`bgcolor`

Esta propiedad define el color de fondo para cada celda en las columnas dentro del conjunto de columnas y puede aceptar valores hexadecimales sRGB, precedidos por un carácter #. Se pueden utilizar los siguientes nombres de colores predefinidos:

Clasificaciones de contenido No hay.

Contenido permitido Si se usa la propiedad span, ninguno es un elemento vacío. Si la propiedad no está presente, el elemento

Acrónimo La etiqueta de inicio se puede omitir si el primer hijo de este elemento es un elemento y este elemento

Elementos del padre

El elemento

, con el elemento  después del elemento opcional , ,  y . pero antes de los elementos , 
Interfaz DOMO HTMLTableColElement
Soporte de navegadores
Chrome Firefox Edge Safari Ópera
Soportado Soportado Soportado Soportado Soportado
Características
En este elemento html colgroup se pueden utilizar propiedades globales.
align
Esta propiedad se utiliza para especificar cómo se alinea cada celda de columna y acepta uno de los siguientes valores:
left: Muestra el contenido a la izquierda de la celda
center: centra el contenido en la celda
right: Muestra el contenido a la derecha de la celda
justify: Muestra el contenido de la línea completa.
Vale la pena señalar que esta característica se ha descuidado en HTML 4 y se ha eliminado en HTML5, y no está permitido su uso, pero el elemento debe formatearse

no son hijos de ese elemento y

`black` = «# 000000»	`green` = «# 008000»
`silver` = «# C0C0C0»	`lime` = «# 00FF00»
`gray` = «# 808080»	`olive` = «# 808000»
`white` = «#FFFFFF»	`yellow` = «# FFFF00»
`maroon` = «# 800000»	`navy` = «# 000080»
`red` = «# FF0000»	`blue` = «# 0000FF»
`purple` = «# 800080»	`teal` = «# 008080»
`fuchsia` = «# FF00FF»	`aqua` = «# 00FFFF»

Cabe señalar que esta función no es estándar y solo la utilizan algunas versiones de Internet Explorer, pero el elemento debe formatearse con CSS. Se puede aplicar un efecto similar a esta propiedad utilizando una propiedad background-color en las celdas de captura.

`span`

Esta propiedad contiene un número positivo que indica el número de columnas sobre las que se extiende el conjunto de columnas representadas por el elemento . El valor predeterminado para esta propiedad, si no se especifica, es 1.

`valign`

Esta propiedad se utiliza para especificar cómo es la alineación vertical de cada celda de columna y acepta uno de los siguientes valores:

baseline: Muestra el contenido lo más cerca posible de la parte inferior de la celda, pero la alineación estará en la línea de base de los caracteres en lugar de en la parte inferior, y si los caracteres son del mismo tamaño, este valor tendrá el mismo efecto que el valor bottom.
bottom: Muestra el contenido lo más cerca posible de la parte inferior de la celda.
middle: Centra el texto en la celda verticalmente.
top: Muestra el contenido lo más cerca posible de la parte superior de la celda.

Vale la pena señalar que esta función se ha descuidado en HTML 4 y se ha eliminado en HTML5, y no está permitido su uso, pero el elemento debe formatearse con CSS, tenga en cuenta las siguientes ideas al formatear este elemento:

No intente usar la propiedad vertical-align en un selector para ese elemento porque los elementos no son hijos de ese elemento y no heredarán este formato.
Si no muestra los elementos de la propiedad en la tabla colspan, use el especificado td:nth-child(an+b)‎y establezca a en cero y b en la posición de la columna en la tabla, por ejemplo , td:nth-child(2) ‎{ vertical-align: top; }‎para alinear el contenido de la segunda columna a la derecha.
Si los elementos de la tabla tienen la propiedad colspan, los selectores CSS se pueden usar de manera similar a [colspan=n].

`width`

Esta propiedad especifica la visualización predeterminada para cada columna en las columnas del conjunto actual, y además de aceptar píxeles y porcentajes valiosos, esta propiedad puede tomar la forma privada 0*, lo que significa que el ancho de la columna debe ser igual al ancho mínimo requerido para mostrar el contenido de la columna; Se puede utilizar, como valores relativos 0.5*‎.

Tenga en cuenta que esta función se ha omitido en HTML5.

Formato predeterminado

La mayoría de los navegadores muestran el elemento estableciendo la propiedad de visualización en table-column-group:

colgroup {
  display: table-column-group;
}