HTML | tfoot Tag - GeeksforGeeks

The <tfoot> tag in HTML is used to give footer group of content. This tag is used in HTML table with header and body which is known as “thead” and “tbody”. <tfoot> tag is child tag of table and parent tag of <tr> and <td>.

Syntax:

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

Attributes: The <tfoot> tag contains many attributes which are supported by HTML4.1 but not supported by HTML5.

align: Set the alignment the text content.
valign: It is used to set the vertically alignment of text content.
char: Aligns the content in a header cell to a character.
charoff: It is used to sets the number of characters that will be aligned from the character specified by the char attribute. The value of this attributes are in numeric form.

Example:

<!DOCTYPE html> 
<html> 
    <head> 
        <title>tfoot tag</title> 
        <style> 
            h1 { 
                color:green; 
            } 
            tfoot { 
                color:blue; 
            } 
            table, tbody, td { 
                border: 1px solid black; 
                border-collapse: collapse; 
            } 
        </style> 
    </head> 
      
    <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>                     

Output:

Supported Browsers: The browser supported by <tfoot> tag are listed below:

Google Chrome
Internet Explorer
Firefox
Safari
Opera

My Personal Notes

Recommended Posts: