Struct Tr

Source

pub struct Tr;

Expand description

The <tr> element - defines a row of cells in a table.

§Purpose

The <tr> element represents a row of cells in a table. Each row contains one or more <th> (header cell) or <td> (data cell) elements. Rows can be grouped within <thead>, <tbody>, and <tfoot> elements for semantic structure.

§Content Categories

None (only valid within <table>, <thead>, <tbody>, or <tfoot>)

§Permitted Content Model

Zero or more <td> or <th> elements
Optionally intermixed with script-supporting elements

§Common Use Cases

Creating rows of data in tables
Organizing tabular information horizontally
Building spreadsheet-like structures
Displaying lists of records
Creating pricing and comparison tables

§Key Attributes

Global attributes only

§Example

<!-- Basic table rows -->
<table>
  <thead>
    <tr>
      <th>Name</th>
      <th>Age</th>
      <th>City</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Alice</td>
      <td>30</td>
      <td>New York</td>
    </tr>
    <tr>
      <td>Bob</td>
      <td>25</td>
      <td>San Francisco</td>
    </tr>
  </tbody>
</table>

<!-- Row with mixed headers and data -->
<table>
  <tbody>
    <tr>
      <th scope="row">Product A</th>
      <td>$99</td>
      <td>In Stock</td>
    </tr>
    <tr>
      <th scope="row">Product B</th>
      <td>$149</td>
      <td>Out of Stock</td>
    </tr>
  </tbody>
</table>

<!-- Row with colspan -->
<table>
  <tr>
    <td colspan="3">Full width cell</td>
  </tr>
  <tr>
    <td>Cell 1</td>
    <td>Cell 2</td>
    <td>Cell 3</td>
  </tr>
</table>

<!-- Alternating row styles -->
<table>
  <tbody>
    <tr class="odd">
      <td>Row 1</td>
      <td>Data</td>
    </tr>
    <tr class="even">
      <td>Row 2</td>
      <td>Data</td>
    </tr>
  </tbody>
</table>