tr
which stands for Table Row is an HTML element tag and is used to define a row of cells in a table.
You use tr
whenever you want to create a table on an HTML page. The column cells can be created by using th
(header cell) and td
(data cell) element tags.
Example code
Here’s an example of how the tr
tag is used to make a table in HTML. This simple table contains three rows and two head columns and six normal columns displaying a name and age of a person:
<table>
<tr>
<th>Name</th>
<th>Age</th>
</tr>
<tr>
<td>John Wick</td>
<td>57</td>
</tr>
<tr>
<td>Tony Stark</td>
<td>48</td>
</tr>
<tr>
<td>Jack Sparrow</td>
<td>39</td>
</tr>
</table>
Let’s take a quick breakdown of what happening in this code:
- You begin by adding a
table
tag. These tags are mandatory to create a table. - Inside the
table
tag, this is where you will use thetr
tag to make a row of cells. You can add one or more rows to each table. Row cells go from up to down. - Inside the
tr
tags, you add the columns by either usingtd
orth
tags. Theth
tag is used to make the header cell while thetd
tag is used to make a data cell. Column cells go from left to right.
In short, tr
is what makes it possible to make a row of cells and it’s a necessary element to create a table in HTML.
This is how it will turn out on the browser:
Some notices about the tr tag
- The
tr
tag will usually contain one or more column element tags liketh
andtd
- The
tr
comes with the rowspan attribute, giving you the additional option of how many the rows should be span in the table cell. - By default, the
tr
tag does not come with borderlines. You will have to style it by yourself using CSS.