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 | 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;
}