
Un elemento html thead define un conjunto de líneas que representan el encabezado de las columnas del elemento <table>
.
Ejemplo de una tabla con tres secciones: encabezado (a través del elemento <thead>
), cuerpo (a través del elemento <tbody>
) y pie de página (a través del elemento <tfoot>
):
< table > < thead > < tr > < th > encabezado 1 </ th > < th > encabezado 2 </ th > </ tr > </ thead > < tbody > < tr > < td > celda normal 1 </ td > < td > celda normal 2 </ td > </ tr > </ tbody > < tfoot > < tr > < th > Apéndice 1 </ th > < th > Apéndice 2 </ th > </ tr > </ tfoot > </ table >
Para ver otros ejemplos de este elemento, consulte la página del elemento <table>
.
Etiqueta html th
Clasificaciones de contenido | No hay. |
---|---|
Contenido permitido | Elemento <tr> cero veces o más. |
Acrónimo | No se puede omitir la etiqueta de inicio.La etiqueta final de un elemento se puede omitir <thead> si va seguida inmediatamente de una <tfoot> o <tbody> . |
Elementos del padre | Elemento <table> y el elemento <thead> debe estar después de cualquier <caption> o <colgroup> , pero antes <tbody> , <tfoot> y <tr> . |
Interfaz DOMO | HTMLTableSectionElement |
Características
En este elemento html thead se pueden utilizar propiedades globales.
align
Esta propiedad se utiliza para especificar cómo se alinea cada celda del grupo 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 ha sido descuidada en HTML 4 y eliminada en HTML5, y no está permitido su uso, pero debe formatearse usando CSS, asignando uno de los valores como left
, center
, right
o justify
a la propiedad text-align
.
bgcolor
Esta propiedad define el color de fondo de cada celda del conjunto y puede aceptar valores hexadecimales sRGB , precedidos por un carácter #
. Se pueden utilizar los siguientes nombres de colores predefinidos:
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 <thead>
con CSS. Se puede aplicar un efecto similar a esta propiedad mediante la propiedad background-color
en celdas <td>
o celdas <th>
.
valign
Esta propiedad se utiliza para especificar cómo es la alineación vertical de cada celda del conjunto 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 característica se ha descuidado en HTML 4 y se ha eliminado en HTML5, y no está permitido su uso, pero debe formatearse con CSS a través de la propiedad vertical-align
.
Formato predeterminado
La mayoría de los navegadores muestran el elemento <thead>
con la propiedad establecida display
en table-header-group
, centrada verticalmente ( vertical-align
) y heredando el valor de la propiedad border-color
:
thead { display: table-header-group; vertical-align: middle; border-color: inherit; }
Soporte de navegadores
Chrome | Firefox | Edge | Safari | Ópera |
---|---|---|---|---|
Soportado | Soportado | Soportado | Soportado | Soportado |
- Elemento summary en HTML
- Elemento details en HTML
- Elemento meter en HTML
- Elemento legend en HTML
- Elemento textarea en HTML
- Elemento select en HTML
- Elemento progress en HTML
- Elemento output en HTML
- Elemento option en HTML
- Elemento optgroup en HTML
- Elemento track en HTML
- Elemento label en HTML
- Elemento input en HTML
- Elemento form en HTML
- Elemento fieldset en HTML
- Elemento datalist en HTML
- Elemento button en HTML
- Elemento tr en HTML
- Elemento thead en HTML
- Elemento th en HTML
- Elemento tbody en HTML
- Elemento tfoot en HTML
- Elemento table en HTML
- Elemento td en HTML
- Elemento colgroup en HTML
- Elemento col en HTML
- Elemento caption en HTML
- Elemento del en HTML
- Elemento script en HTML
- Elemento noscript en HTML
- Elemento canvas en HTML
- Elemento picture en HTML
- Elemento ins en HTML
- Elemento video en HTML
- Elemento source en HTML
- Elemento param en HTML
- Elemento object en HTML
- Elemento embed en HTML
- Elemento map en HTML
- Elemento img en HTML
- Elemento audio en HTML
- Elemento area en HTML