What is <tr> and <td>?

In HTML, <tr> and <td> are fundamental tags used to structure tables. They work together to create rows and cells within a table.

: The Table Row Element

The <tr> tag defines a table row. Each row in an HTML table is represented by a <tr> element. Think of it as a single horizontal line within your table. It contains one or more table cells (<td> or <th>). Without <tr>, you cannot create a table row.

• Example: <tr><td>Data 1</td><td>Data 2</td></tr> creates a row with two data cells.

: The Table Data Cell Element

The <td> tag defines a standard table cell. This is where you place the actual data or content within each cell of a table row. <td> cells can contain text, images, lists, and other HTML elements.

• Example: In the example above, "Data 1" and "Data 2" are placed inside <td> tags.

Relationship Between and

<td> elements are always nested inside <tr> elements. You cannot have a <td> without a parent <tr>. This is because a table cell always belongs to a specific row.

• Illustrative Table Structure:

<table>
  <tr>
    <td>Cell 1, Row 1</td>
    <td>Cell 2, Row 1</td>
  </tr>
  <tr>
    <td>Cell 1, Row 2</td>
    <td>Cell 2, Row 2</td>
  </tr>
</table>

Multiple sources confirm that <tr> stands for "table row" and <td> stands for "table data". They are essential components for creating well-structured and semantically correct HTML tables. While tables can be styled with CSS for visual appeal, the fundamental structure relies on the proper use of <table>, <tr>, and <td> (and <th> for table header cells).