Description

The HTML element <tfoot> is used to define a table footer, which can contain one or more table rows summarizing the columns of a table.

  • Element <tfoot> must appear after the <caption>, <colgroup>, and <thead> elements in case they are defined.
  • Element <tfoot> must appear before the <tbody> and <tr> elements.

Table rows can be grouped into the below sections, where each section can contain one or more table rows.

  • Element <thead> to table header section
  • Element <tfoot> to table footer section
  • Element <tbody> to table body section

The below table summarizes its usage.

Usage Details
Placement It is a child of <table> element.
Contents It can contain one or more <tr> elements.
Tags Both opening and closing tags are required.
Versions HTML 4, 4.01, 5

Syntax

Here is the basic syntax of the <tfoot> element.

<tfoot>...</tfoot>

Examples

Run this on IDE

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Example - HTML Element tfoot</title>
</head>
<body>
    <table>
        <caption>Products List</caption>
        <thead>
            <tr>
                <th>Product</th>
                <th>Sales</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>Bread</td>
                <td>10000</td>
            </tr>
            <tr>
                <td>Butter</td>
                <td>3000</td>
            </tr>
        </tbody>
    </table>
</body>
</html>

Attributes

The following table shows the list of supported and unsupported attributes for the <tfoot> element.

Attribute Type Details
Element-Specific Attributes The tag <tfoot> has some element-specific attributes listed in the below table.
Global Attributes Like all other HTML tags, the tag <tfoot> supports the HTML Global Attributes.
Event Attributes The tag <tfoot> also supports the HTML Event Attributes.

Here is a list of attributes that are specific to the <tfoot> element.

Attribute Value Required Description
align left, right, center, justify, char No Obsolete
Specifies the horizontal alignment of cell content inside a table footer.
char character No Obsolete
Sets the character to which cell contents of the table footer should align.
charoff number No Obsolete
Defines the number of characters by which cell contents of the table footer will be offset from the alignment characters specified by the char attribute.
valign top, middle, bottom, baseline No Obsolete
Specifies the vertical alignment of the text within each row of cells of the table footer.

Browser Compatibility

The tag <tfoot> is supported in all modern browsers.

  • Google Chrome 1+
  • Internet Explorer or Edge 2+
  • Firefox 1+
  • Apple Safari 1+
  • Opera 4+

Related Links