This reference is built into PageRIJ — a live HTML, CSS & SVG authoring and learning environment.

HTML <tfoot> element

The <tfoot> element groups the footer rows of a table. These rows usually contain summaries, totals, notes, or closing values for the columns above.

Inside <tfoot>, the rows are written with <tr> elements. The cells inside those rows may be ordinary data cells or header cells, depending on what the footer row is doing.

A common example is a table of prices or scores where the final row gives a total. The total row is not just another body row; it closes or summarizes the table.

The <tfoot> element belongs to the table's structure, not merely to its visual bottom. It marks footer information for the table, just as <thead> marks header information.

The element should not be used merely because a row happens to appear last. If the final row is ordinary data, it belongs in <tbody>. If it summarizes or closes the table, <tfoot> is a better fit.

A <table> can have at most one <tfoot>. In current HTML, place it after the body groups or body rows. A total label can use <th scope="row">, with the total itself in a <td>.

Attributes: GLOBALS.

Typical layout:
<table>
  <caption>Workshop prices</caption>
  <thead>
    <tr>
      <th scope="col">Workshop</th>
      <th scope="col">Price</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <th scope="row">Flex</th>
      <td>€6</td>
    </tr>
  </tbody>
  <tfoot>
    <tr>
      <th scope="row">Total</th>
      <td>€6</td>
    </tr>
  </tfoot>
</table>
Visual representation:
Workshop prices
Workshop Price
Flex €6
Total €6