HTML <tfoot> Tag Tutorial - Usage, Syntax, Attributes, faq and Example

INTRODUCTION

In HTML, <tfoot> element is used to group the footer content of a table. It usually contains summary information or totals related to the table data.

The <tfoot> element should be placed after any <caption>, <colgroup>, <thead>, <tbody>, and <tr> elements.

The tbody, along with thead and tfoot element, helps give semantic meaning to parts of a table. It's useful for showing tables on screens or in print, and it also helps screen readers and search engines understand the table better."

<table>
  <thead>
    <tr>
        <th>Fruit</td>
        <th>Price</td>
        <th>Quantity</td>
    </tr>
  </thead>
  <tbody>
    <tr>
        <td>Apple</td>
        <td>$1</td>
        <td>50</td>
    </tr>
    <tr>
        <td>Banana</td>
        <td>$0.5</td>
        <td>100</td>
    </tr>
  </tbody> 
  <tfoot>
    <tr>
        <td>Total Cost</td>
        <td colspan="2">$100</td>
        
    </tr>
  </tfoot>   
</table>

Attributes

The <tfoot> element only has global Attributes.

Deprecated Attributes

The following attribute are Deprecated and is advised to not use them. They are mentioned just for reference for updating legacy code or for historical interest.

• align
• bgcolor
• char
• charoff
• valign

Tag Omission

Start Tag - The <tfoot> start tag is mandatory

End Tag - The </tfoot> end tag can be left out if the table element has no more content after it.

Permitted parents

The permitted parent of <tfoot> element is <table> element.

Frequently Asked Questions(FAQ)