<thead>El elemento <thead> en HTML5 se utiliza para agrupar el contenido de la cabecera en una tabla HTML. Proporciona una manera de separar las filas de encabezado del resto de los datos en la tabla, mejorando así la accesibilidad y la estructura semántica de la página web. El uso de <thead> junto con otros elementos como <tbody> y <tfoot> facilita la organización y la comprensión de los datos tabulares.
<thead>El <thead> en HTML5 puede llevar los siguientes atributos globales, aunque no tiene atributos específicos propios:
accesskey: Proporciona una forma abreviada de acceso mediante teclas a un elemento.class: Permite asignar una o varias clases CSS al elemento para su estilización.contenteditable: Indica si el contenido del elemento es editable.contextmenu: Asocia un menú contextual con el elemento.dir: Define la dirección del texto, como "ltr" (de izquierda a derecha) o "rtl" (de derecha a izquierda).draggable: Indica si un elemento es arrastrable o no.dropzone: Especifica qué tipos de contenido se pueden soltar en el elemento.hidden: Oculta el elemento.id: Establece un identificador único para el elemento.lang: Define el idioma del contenido del elemento.spellcheck: Indica si el contenido del elemento debe ser revisado por errores ortográficos o no.style: Permite incluir reglas CSS en línea.tabindex: Define el orden de tabulación del elemento en el documento.title: Proporciona información adicional sobre el elemento en forma de tooltip.translate: Indica si el contenido del elemento debe ser traducido o no.<thead> en HTML5 con Ejemplos SencillosEl <thead> se utiliza para contener una fila o varias filas de encabezados en una tabla. Los elementos <th> (table header cell) dentro de <thead> representan cada célula de cabecera.
<thead>:<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ejemplo de uso de thead</title>
<style>
table {
width: 100%;
border-collapse: collapse;
}
th, td {
border: 1px solid black;
padding: 8px;
text-align: left;
}
th {
background-color: #f2f2f2;
}
</style>
</head>
<body>
<table>
<thead>
<tr>
<th>Nombre</th>
<th>Apellido</th>
<th>Edad</th>
</tr>
</thead>
<tbody>
<tr>
<td>Juan</td>
<td>Pérez</td>
<td>28</td>
</tr>
<tr>
<td>Ana</td>
<td>Gómez</td>
<td>35</td>
</tr>
</tbody>
</table>
</body>
</html><table>.<thead>): Dentro de <thead>, se crea una fila (<tr>) que contiene las células de encabezado (<th>) para "Nombre", "Apellido" y "Edad".<tbody>): Aquí están las filas de datos de la tabla.<thead>:En resumen, el uso de <thead> no solo organiza y clarifica la estructura de una tabla en HTML5, sino que también ayuda a mejorar la accesibilidad y la experiencia del usuario.