HTML: <tr> tag
This HTML tutorial explains how to use the HTML element called the <tr> tag with syntax and examples.
Description
The HTML <tr> tag defines a row in an HTML table. Each <tr> tag can contain one or more <th> tags that define header cells in the table or one or more <td> tags that define standard cells in the table. This tag is also commonly referred to as the <tr> element.
Syntax
In HTML, the syntax for the <tr> tag is: (example of a table with 2 columns and 4 rows)
<body>
<table>
<tr>
<th>Item</th>
<th>Amount</th>
</tr>
<tr>
<td>Grapes</td>
<td>$18</td>
</tr>
<tr>
<td>Apples</td>
<td>$4</td>
</tr>
<tr>
<td>Pears</td>
<td>$7</td>
</tr>
</table>
</body>
Sample Output
Attributes
In addition to the Global Attributes, the following is a list of attributes that are specific to the <tr> tag:
Attribute | Description | HTML Compatibility |
---|---|---|
align | Horizontal alignment of text in each cell within the row. It can be one of the following values: left, center, right, justify, char | Deprecated in HTML 4.01, Obsolete in HTML5, use CSS |
bgcolor | Background color of each cell within a row | Deprecated in HTML 4.01, Obsolete in HTML5, use CSS |
char | Set the character to align the cells in a column | Deprecated in HTML 4.01, Obsolete in HTML5 |
charoff | Number of characters to offset column data from the alignment characters (in char attribute) | Deprecated in HTML 4.01, Obsolete in HTML5 |
valign | Vertical alignment of text of each cell within a row. It can be one of the following values: baseline, bottom, middle, top | Deprecated in HTML 4.01, Obsolete in HTML5, use CSS |
Note
- The HTML <tr> element is found in an HTML table within the <body> tag.
- The <tr> tag is made up of one or more <th> or <td> tags.
- The <tr> tag defines the table rows. There must be at least one row in the table.
- The <th> tag defines the header cells in the table which are displayed as bold, center-aligned text.
- The <td> tag defines the standard cells in the table which are displayed as normal-weight, left-aligned text.
Browser Compatibility
The <tr> tag is compatible with the following browsers:
- Chrome
- Android
- Firefox (Gecko)
- Firefox Mobile (Gecko)
- Internet Explorer (IE)
- Edge Mobile
- Opera
- Opera Mobile
- Safari (WebKit)
- Safari Mobile
Example
We will discuss the <tr> tag below, exploring examples of how to use the <tr> tag in HTML5, HTML 4.01 Transitional, XHTML 1.0 Transitional, XHTML 1.0 Strict, and XHTML 1.1.
Advertisements