HTML Tag: thead

Table header. Along with <tfoot> and <tbody>, thead can be used to group a series of rows. The HTML <thead> tag is used for adding a header to a table.

The <thead> tag is used in conjunction with the <tbody> tag and the <tfoot> tag in determining each part of the table (header, footer, body). Browsers can use this information to enable scrolling of the table body independently of the header and footer - particuarly useful for large tables. Also, when printing a large table that spans multiple pages, this information can enable the table header and footer to be printed at the top and bottom of each page.

Note: If you use the <thead> tag, it must be used in the following context:

  • As a child of a <table> element, after any <caption>, and <colgroup> elements and before any <tbody>, <tfoot>, and <tr> elements, but only if there are no other <thead> elements that are children of the <table> element.
  • The <thead> tag can contain zero or more <tr> elements, which in turn, can contain zero or more <th> elements (but no <td> elements).

Required Attributes

  • None.

Optional Attributes

  • align can be used to horizontally align the cells within the element. The value can be left, center, right, justify or char.
  • valign can be used to vertically align the cells within the element. The value can be top, middle, bottom or baseline.
  • char can be used to specify a character with which cells will align, such as a decimal point. It is not supported by any major browser.
  • charoff can be used to specify the number of pixels the alignment should be offset from the char character. It is not supported by any major browser.
  • Common attributes

Example

<table>
	<thead>
		<tr>
			<th>Name</th>
			<th>Nationality</th>
		</tr>
	</thead>
	<tfoot>
		<tr>
			<td>Footer 1</td>
			<td>Footer 2</td>
		</tr>
	</tfoot>
	<tbody>
		<tr>
			<td>John</td>
			<td>English</td>
		</tr>
		<tr>
			<td>Pedro</td>
			<td>Portuguese</td>
		</tr>
	</tbody>
</table>

Changes in HTML5

  • The HTML5 specification disallows having <td> elements within <thead> elements. This tends to make sense, given that the <th> element stands for "Table Header".

Related Tags