HTML <tfoot> Tag

The tfoot element specifies a group of rows that comprise the table footer in an HTML table. It is widely used to display column totals and may be used to summarize the columns in a table.

Traditionally, the <tfoot> tag would be styled using CSS to highlight the column totals.

This tag is sometimes referred to as the <tfoot> element.

Syntax

<tfoot> Contents here... </tfoot>

Example

<!DOCTYPE html>
<html>
<head>
  <style>
	table{
	  border-collapse: collapse;
	}
	table, th, td {
	  border: 1px solid black;
	}
  </style>
</head>
<body>

<table>
  <thead>
	<tr>
	  <th>Subject</th>
	  <th>Mark</th>
	</tr>
  </thead>
  <tbody>
	<tr>
	  <td>English</td>
	  <td>60</td>
	</tr>
	<tr>
	  <td>Maths</td>
	  <td>78</td>
	</tr>
  </tbody>
  <tfoot>
	<tr>
	  <td>Sum</td>
	  <td>138</td>
	</tr>
  </tfoot>
</table>

</body>
</html>

Preview

Supported Browsers

Element	Chrome	Firefox	Safari	Edge / IE	Opera
<tfoot>	Yes	Yes	Yes	Yes	Yes

<th>

HTML <tfoot> Tag

Syntax

Example

Supported Browsers

Links

Tutorials

Connect with us