HTML <tfoot> Tag

There are 3 main parts in HTML tables:

The <thead> means header of an HTML table and the <tbody> means body of an HTML table. Now, let's explain the <tfoot> tag.

The <tfoot> element defines the footer part of an HTML table.

It is used along with thead and tbody elements to define header, body and footer parts of a table.

It must have one or more rows to give a footer information for data cells.

Syntax

The <tfoot> tag comes in pairs. We must write the content between the opening (<tfoot>) and closing (</tfoot>) tags.

Example

<!DOCTYPE html>
<html>
   <head>
      <title>Title of the document</title>
   </head>
   <body>
      <table summary="Goalscorers" width="400" border="1">
         <caption>FIFA World Cup 2018 Top Goalscorers<hr></caption>
         <thead>
            <tr>
               <th>Name</th>
               <th>Country</th>
               <th>Goals</th>
            </tr>
         </thead>
         <tfoot>
            <tr>
               <td>Name</td>
               <td>Country</td>
               <td>Goals</td>
            </tr>
         </tfoot>
         <tbody>
            <tr>
               <td>Harry Kane</td>
               <td>England</td>
               <td>6</td>
            </tr>
            <tr>
               <td>Christiano Ronaldo</td>
               <td>Portugal</td>
               <td>4</td>
            </tr>
            <tr>
               <td>Neymar</td>
               <td>Brazil</td>
               <td>2</td>
            </tr>
         </tbody>
      </table>
   </body>
</html>

In the given example the content is written between opening <tfoot> and closing </tfoot> tags. We used the <tr> tag in it, and <td> tag for the content between opening <tr> and closing </tr> tags.

Attributes:

Attributes Value Description
align right
left
center
justify
char
Was used to align the content inside cells.
This attribute is not supported by HTML5.
bgcolor bgcolor Was used to give a background for cells.
This attribute is not supported by HTML5.
char character Was used to align the cells by setting a character.
This attribute is not supported by HTML5.
charoff number Was used for indicating number of characters to offset column data from the alignment characters which were defined by char attribute.
This attribute is not supported by HTML5.
valign top
bottom
middle
baseline
Was used to align contents inside tfoot element vertically.
This attribute is not supported by HTML5.

The <tfoot> tag also supports the Global Attributes.