Ejemplo
Una tabla HTML con una <thead>, <tfoot> y un <tbody> elemento:
<table>
<thead>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
</thead>
<tfoot>
<tr>
<td>Sum</td>
<td>$180</td>
</tr>
</tfoot>
<tbody>
<tr>
<td>January</td>
<td>$100</td>
</tr>
<tr>
<td>February</td>
<td>$80</td>
</tr>
</tbody>
</table>
Inténtalo tú mismo " Definición y Uso
La <tfoot> etiqueta se utiliza para el contenido de pie de grupo en una tabla HTML.
La <tfoot> elemento se utiliza en conjunción con los <thead> y <tbody> elementos para especificar cada parte de una tabla (pie de página, encabezado, cuerpo).
Los navegadores pueden utilizar estos elementos para permitir el desplazamiento del cuerpo de la tabla de forma independiente de la cabecera y el pie. Además, cuando se imprime una gran tabla que abarca varias páginas, estos elementos pueden permitir a la cabecera de la tabla y el pie de página que se imprimirá en la parte superior e inferior de cada página.
La <tfoot> etiqueta debe ser utilizado en el siguiente contexto: Como hijo de un <table> elemento, después de cualquier <caption>, <colgroup> y <thead> elementos y antes de cualquier <tbody> y <tr> elementos.
Soporte para el navegador
| Elemento | |||||
|---|---|---|---|---|---|
| <tfoot> | Sí | Sí | Sí | Sí | Sí |
Notas y sugerencias
Nota: La <tfoot> elemento debe tener uno o más <tr> etiquetas en el interior.
Consejo: La <thead>, <tbody> y <tfoot> elementos que no modifiquen la composición de la tabla por defecto.Sin embargo, puede utilizar CSS para el estilo de estos elementos.
Diferencias entre HTML 4.01 y HTML5
Ninguno de los atributos HTML 4.01 son compatibles con HTML5.
atributos
| Atributo | Valor | Descripción |
|---|---|---|
| align | right left center justify char | No se admite en HTML5. Alinea el contenido dentro de la <tfoot> elemento |
| char | character | No se admite en HTML5. Alinea el contenido dentro de la <tfoot> elemento de un personaje |
| charoff | number | No se admite en HTML5. Establece el número de caracteres que el contenido dentro de la <tfoot> elemento se alineará desde el carácter especificado por el char atributo |
| valign | top middle bottom baseline | No se admite en HTML5. Vertical: alinea el contenido dentro de la <tfoot> elemento |
Los atributos globales
La <tfoot> etiqueta también es compatible con el de los atributos globales en HTML .
Atributos de eventos
La <tfoot> etiqueta también es compatible con la atributos de eventos en HTML .
Ajustes por defecto CSS
La mayoría de los navegadores mostrarán el <tfoot> elemento con los siguientes valores predeterminados:
tfoot {
display: table-footer-group;
vertical-align: middle;
border-color: inherit;
}