Los encabezados de tabla se definen con el elemento th. Cada elemento th representa una celda de tabla.
Ejm
<table> <tr> <th>Firstname</th> <th>Lastname</th> <th>Age</th> </tr> <tr> <td>Jill</td> <td>Smith</td> <td>50</td> </tr> <tr> <td>Eve</td> <td>Jackson</td> <td>94</td> </tr> </table>
Encabezado vertical
Para usar la primera columna como encabezados de tabla, defina la primera celda de cada fila como un elemento th.
Ejm
<table> <tr> <th>Firstname</th> <td>Jill</td> <td>Eve</td> </tr> <tr> <th>Lastname</th> <td>Smith</td> <td>Jackson</td> </tr> <tr> <th>Age</th> <td>94</td> <td>50</td> </tr> </table>
Alinear encabezados
Por defecto los encabezados se sitúan en el centro de la celda. Para alinearlos de distinta manera se utiliza la propiedad CSS text-align.
Ejm
th {
text-align: left;
}Encabezados para múltiples columnas
Puede tener un encabezado que abarque dos o más columnas. Para ello se utiliza el atributo colspan dentro de la etiqueta <th>.
Ejm
<table> <tr> <th colspan="2">Name</th> <th>Age</th> </tr> <tr> <td>Jill</td> <td>Smith</td> <td>50</td> </tr> <tr> <td>Eve</td> <td>Jackson</td> <td>94</td> </tr> </table>
Título de la tabla
Para añadir un título a la tabla utilizamos la etiqueta <caption> de la siguiente manera.
Ejm
<table style="width:100%"> <caption>Monthly savings</caption> <tr> <th>Month</th> <th>Savings</th> </tr> <tr> <td>January</td> <td>$100</td> </tr> <tr> <td>February</td> <td>$50</td> </tr> </table>