HTML tfoot Tag

Last Updated : 14 Dec, 2023

The HTML <tfoot> tag is used to give a footer group of content in an HTML table. This tag is used in an HTML table with a header and body which is known as “thead” and “tbody”. <tfoot> tag is child tag of table and parent tag of <tr> and <td>. The <tfoot> element must have one or more <tr> tags inside.

Syntax

<tfoot> 
// Table footer contents... 
</tfoot>

Attributes

The attributes for the <tfoot> tag are supported by HTML4.1 only but are now deprecated in HTML5. To get the same effect use CSS to style text-align and vertical align.

Attributes	Descriptions
align	Set the alignment of the text content.
valign	It is used to set the vertical alignment of text content.
char	Aligns the content in a header cell to a character.
charoff	It is used to set the number of characters aligned with the character specified by the char attribute. The value of these attributes is in numeric form.

Note: The <tfoot> tag also supports the Global Attributes and Event Attributes in HTML.

Example: In this example, we will see how to implement the above tag in HTML.

HTML

<!DOCTYPE html>
<html>
 
<body>
    <center>
        <h1>GeeksforGeeks</h1>
        <h2>tfoot Tag</h2>
        <table>
            <thead>
                <tr>
                    <th>Name</th>
                    <th>User Id</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>Ram</td>
                    <td>@ram_b</td>
                </tr>
                <tr>
                    <td>Shashank</td>
                    <td>@shashankla</td>
                </tr>
                <tr>
                    <td>Rahman</td>
                    <td>@rahamD</td>
                </tr>
            </tbody>
 
            <!-- tfoot tag starts from here -->
            <tfoot>
                <tr>
                    <td>Total user</td>
                    <td>4</td>
                </tr>
            </tfoot>
            <!-- tfoot tag ends here -->
 
        </table>
    </center>
</body>
 
</html>