Część TFOOT tabeli HTML

Za pomocą elementu tfoot możemy wskazać przeglądarce internetowej, które wiersze budujące tabelę HTML posiadają zawartość reprezentującą treść pełniącą rolę podsumowującą dla treści reprezentowanej przez zawartość poszczególnych kolumn występujących w danej tabeli HTML.

Przykład:

<table border>
  <caption>Rośliny Świata</caption>

  <thead>
    <tr>
      <th>owoce</th>
      <th>warzywa</th>
      <th>drzewa</th>
      <th>kwiaty</th>
    </tr>
  </thead>

  <tbody>
    <tr>
      <td>czereśnia</td>
      <td>seler</td>
      <td>sosna</td>
      <td>róża</td>
    </tr>

    <tr>
      <td>jabłko</td>
      <td>marchew</td>
      <td>dąb</td>
      <td>tulipan</td>
    </tr>

    <tr>
      <td>gruszka</td>
      <td>rzodkiewka</td>
      <td>świerk</td>
      <td>słonecznik</td>
    </tr>
  </tbody>

  <tfoot>
    <tr>
      <th colspan="4">moje ulubione rośliny</th>
    </tr>

    <tr>
      <td>czereśnia</td>
      <td>rzodkiewka</td>
      <td>dąb</td>
      <td>róża</td>
    </tr>
  </tfoot>
</table>

Rezultat:

Przyglądając się naszej przykładowej tabeli HTML możemy dojść do wniosku, że każda kolumna budująca naszą przykładową tabelę HTML posiada swoją własną treść podsumowującą mówiącą o tym, jaka roślina, której nazwa znajduje się w danej kolumnie, jest naszą ulubioną rośliną. W tym wypadku wspomniana treść podsumowująca reprezentowana jest przez zawartość komórek piątego oraz szóstego wiersza budującego naszą przykładową tabelę HTML, dlatego wspomniany piąty oraz szósty wiersz (element tr) wraz ze swoją zawartością może zostać przez nas umieszczony w elemencie tfoot.

Tylko jeden element "tfoot" może być elementem dzieckiem elementu "table".

Nie jest wymogiem, aby element "tfoot" był ostatnim elementem dzieckiem elementu "table", jednak najczęściej tego typu rozwiązanie jest najlogiczniejsze.