<th> HTML Tag

What does <th> HTML Tag do?

The <th> element is used to identify table cells that contain column header values rather than table data. A row of table heading values is created by nesting multiple <th> values in a parent <tr> element.

Display

inline

Code Example

<p>A table of topographical features</p>
<table>
  <tr>
    <th>Pointy</th>
    <th>Flat</th>
    <th>Wet</th>
  </tr>
  <tr>
    <td>Mountains</td>
    <td>Plains</td>
    <td>Rivers</td>
  </tr>
  <tr>
    <td>Rocky Outcroppings</td>
    <td>Mesas</td>
    <td>Lakes</td>
  </tr>
</table>

Adding Headings to Table Columns

Data in HTML tables is arranged vertically into columns. In most cases, you will want the first row of the table to be displayed as headings or labels for each table column. The correct way to do this is to use <th> elements rather than <td> elements for the content in the first row of the table. By default, browsers will center the contents of <th> elements and display them in a bold typeface. However, it’s also easy to style table headings independently of the rest of the table contents thanks to the use of this case-specific element for table headings.

Adam Wood

Adam is a technical writer who specializes in developer documentation and tutorials.