HTML <th> Tag
Example
A simple HTML table with two header cells and two data cells:
<table>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>
Try it yourself »
More "Try it Yourself" examples below.
Definition and Usage
The <th> tag defines a header cell in an HTML table.
An HTML table has two kinds of cells:
- Header cells - contains header information (created with the <th> element)
- Standard cells - contains data (created with the <td> element)
The text in <th> elements are bold and centered by default.
The text in <td> elements are regular and left-aligned by default.
Browser Support
| Element | |||||
|---|---|---|---|---|---|
| <th> | Yes | Yes | Yes | Yes | Yes |
Tips and Notes
Tip: Use the colspan and rowspan attribute to let the content span over multiple columns or rows!
Differences Between HTML 4.01 and HTML5
All layout attributes are removed in HTML5.
Attributes
| Attribute | Value | Description |
|---|---|---|
| abbr | text | Specifies an abbreviated version of the content in a header cell |
| align | left right center justify char |
Not supported in HTML5. Aligns the content in a header cell |
| axis | category_name | Not supported in HTML5. Categorizes header cells |
| bgcolor | rgb(x,x,x) #xxxxxx colorname |
Not supported in HTML5. Specifies the background color of a header cell |
| char | character | Not supported in HTML5. Aligns the content in a header cell to a character |
| charoff | number | Not supported in HTML5. Sets the number of characters the content will be aligned from the character specified by the char attribute |
| colspan | number | Specifies the number of columns a header cell should span |
| headers | header_id | Specifies one or more header cells a cell is related to |
| height | pixels % |
Not supported in HTML5. Sets the height of a header cell |
| nowrap | nowrap | Not supported in HTML5. Specifies that the content inside a header cell should not wrap |
| rowspan | number | Specifies the number of rows a header cell should span |
| scope | col colgroup row rowgroup |
Specifies whether a header cell is a header for a column, row, or group of columns or rows |
| sorted | reversed number reversed number number reversed |
Defines the sort direction of a column |
| valign | top middle bottom baseline |
Not supported in HTML5. Vertical aligns the content in a header cell |
| width | pixels % |
Not supported in HTML5. Specifies the width of a header cell |
Global Attributes
The <th> tag also supports the Global Attributes in HTML.
Event Attributes
The <th> tag also supports the Event Attributes in HTML.
Try it Yourself - Examples
Table headers
How to create table headers.
Table with a caption
An HTML table with a caption.
Tags inside a
table
How to display elements inside other elements.
Cells that span more than one row/column
How to define table cells that span more than one row or one column.
Related Pages
HTML tutorial: HTML Tables
HTML DOM reference: TableHeader Object
CSS Tutorial: Styling Tables
Default CSS Settings
Most browsers will display the <th> element with the following default values:
th {
display: table-cell;
vertical-align: inherit;
font-weight: bold;
text-align: center;
}
