HTML Table Rows

Tables are an essential feature in HTML, used to organize and display data in a grid-like structure. A key part of creating tables is working with rows, represented by the <tr> tag. In this tutorial, we'll break down what table rows are and how to use them effectively.

What is a Table Row?

In HTML, a table row is created using the <tr> (table row) tag. It groups table cells into horizontal rows. Each <tr> can contain one or more table cells, which are defined by the <td> (table data) or <th> (table header) tags.

Basic Syntax of a Table Row

Here's the structure of a simple table:

<table>
  <tr>
    <th>Column 1</th>
    <th>Column 2</th>
    <th>Column 3</th>
  </tr>
  <tr>
    <td>Row 1, Cell 1</td>
    <td>Row 1, Cell 2</td>
    <td>Row 1, Cell 3</td>
  </tr>
  <tr>
    <td>Row 2, Cell 1</td>
    <td>Row 2, Cell 2</td>
    <td>Row 2, Cell 3</td>
  </tr>
</table>

How it Works

• tr: Defines a row in the table.
• th: Represents header cells within the row, usually styled bold and centered by default.
• td:Represents standard data cells within the row.

Example Explained

In the example above:

• The first <tr> creates the header row with three header cells <td>.
• The second and third <tr> tags create two data rows, each containing three cells <td>.

The <tr> tag creates rows in a table. Using table rows effectively will help you structure data neatly and make it more understandable for users.