Definition
The <tfoot>
HTML element is used to define the footer section of a table. It is typically used to group together the footer rows (<tr>
) that contain summary or additional information related to the table’s content.
Here’s an example of how to use the <tfoot>
element:
<table>
<thead>
<tr>
<th>Product</th>
<th>Price</th>
<th>Quantity</th>
</tr>
</thead>
<tbody>
<tr>
<td>Item 1</td>
<td>$10</td>
<td>2</td>
</tr>
<tr>
<td>Item 2</td>
<td>$15</td>
<td>1</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="2">Total</td>
<td>$35</td>
</tr>
</tfoot>
</table>
In this example, the <tfoot>
element is used to enclose the footer row (<tr>
) that contains the total value of the items in the table. The colspan
attribute is used to span the first two cells of the footer row, merging them into a single cell.
The <tfoot>
element is often used to display summary information, calculations, or other data related to the table’s content. It is typically placed after the <tbody>
element and before the closing </table>
tag.
It’s important to note that the <tfoot>
element is optional. If there is no need for a footer section in the table, you can omit it entirely.