tr element represents a row in a
table. In HTML, tables are formed by a set of rows, each containing a number of cells. Therefore, this element is usually found holding one or more cells, that can be header cells (
th) or data cells (
This element can be present as child of
table. If it's declared as child of
table, it must be placed after all other elements except
tfoot and there must be no
tbody elements present in the table.
In previous versions of the standard, the
tr element had several presentational attributes that have been removed in the HTML5 specification. Authors should drop their use in favor of style sheets.
The following example represents a
table with a header (
thead) and a body (
tbody). The rows of this table, represented by the
tr element, are present in both containers described before and hold a number of three cells each.
<table class="egt"> <thead> <tr> <th>Film</th> <th>Gross</th> <th>Year</th> </tr> </thead> <tbody> <tr> <td>Avatar</td> <td>$2,787,965,087</td> <td>2009</td> </tr> <tr> <td>Titanic</td> <td>$2,186,772,302</td> <td>1997</td> </tr> <tr> <td>The avengers</td> <td>$1,518,594,910</td> <td>2012</td> </tr> </tbody> </table>
Now, we'll insert a
table without a
tbody. Here, the rows of the implicit body are declared as children of the
table itself and, as in the previous example, header rows are declared inside a
thead section. Note how the
thead section is properly preceding the rows of the implicit body.
<table class="egt"> <thead> <tr> <th>Name</th> <th>Estimated IQ</th> </tr> </thead> <tr> <td>Sir Isaac Newton</td> <td>190</td> </tr> <tr> <td>Leonardo da Vinci</td> <td>180</td> </tr> <tr> <td>Johannes Kepler</td> <td>175</td> </tr> </table>
|Sir Isaac Newton||190|
|Leonardo da Vinci||180|
The horizontal alignment of text in all the cells in the row. There are five possible values (case-insensitive):
- left: text is aligned to the left margin. This is the default value for data cells (
- center: text is centered. This is the default value for header cells (
- right: text is aligned to the right margin.
- justify: text is justified or aligned to both margins.
- char: text is aligned to a specific character. It's used together with the
This attribute has become obsolete in HTML5 and, therefore, its use is no longer valid. Authors should replace it with style sheet declarations.
A caracter that will act as axis for text alignment. It's meant to work together with the
align attribute when it has the "char" value. In other situations it will be completely ignored.
This attribute has become obsolete in HTML5 and its use is consequently invalid. Authors are adviced to replace it with style sheet declarations.
<tr align="char" char="c">
An offset, from the first occurrence of the alignment caracter (specified in the
char attribute) and in the direction of the text. The resulting character of this calculation will be the axis for text alignment.
For this attribute to be considered, the
align attribute's value must be "char" and the
char attribute must be present.
This attribute is considered obsolete by HTML5 and its use is no longer recommended. Authors should drop its use in favor of style sheets.
<tr align="char" char="t" charoff="7">
The vertical alignment of the text in all the cells in the row. There are four possible values (case-insensitive):
- top: text is aligned to the top margin.
- middle: text is vertically centered.
- bottom: text is aligned to the bottom margin.
- baseline: all the cells in a row with this alignment should have their first text line on a common baseline.
This attribute is obsolete according to the HTML5 standard and, therefore, invalid. Authors are adviced to avoid its use and replace it with style sheet declarations.
A color to fill the background of the element.
bgcolor attribute has been removed from the HTML5 standard because of its presentational nature. Its results can be perfectly achieved with style sheets.
For information about global attributes refer to this list of global attributes in HTML5.
For information about global events refer to this list of global events in HTML5.