tr: The Table Row element

The <tr> HTML element defines a row of cells in a table. The row’s cells can then be a mix of <td> (data cell) and <th> (header cell) elements.

Attributes

Global attributes

accesskey Specifies a keyboard shortcut to activate or focus an element.

aria-* Defines accessibility properties and states for assistive technologies.

class Specifies one or more CSS class names for styling the element.

data-* Stores custom data private to the page or application.

dir Sets the text direction (left-to-right, right-to-left, or auto).

hidden Hides the element from display and assistive technologies.

id Defines a unique identifier for the element within the document.

inputmode Hints which virtual keyboard type to display on mobile devices.

itemid Provides a global identifier for microdata items.

itemprop Defines a property name-value pair for microdata.

itemref Associates properties with an item via element IDs for microdata.

itemscope Creates a new microdata item container.

itemtype Specifies the vocabulary URL for microdata items (like Schema.org).

lang Specifies the primary language of the element’s content.

nonce Provides a cryptographic nonce for Content Security Policy.

role Defines the element’s semantic role for accessibility.

tabindex Controls keyboard navigation order and focusability.

title Provides advisory information displayed as a tooltip.

Example

<table>
  <caption>Homebrew Website Club Meetups</caption>
  <thead>
    <tr>
      <th>City</th>
      <th>Day</th>
      <th>Time</th>
      <th>Venue</th>
      <th>Organizer</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>San Francisco</td>
      <td>Wednesday</td>
      <td>6:30 PM</td>
      <td>Mozilla SF</td>
      <td>Tantek Çelik</td>
    </tr>
    <tr>
      <td>Portland</td>
      <td>Wednesday</td>
      <td>7:00 PM</td>
      <td>Lucky Lab</td>
      <td>Aaron Parecki</td>
    </tr>
    <tr>
      <td>Brighton</td>
      <td>Wednesday</td>
      <td>7:30 PM</td>
      <td>68 Middle Street</td>
      <td>Adactio</td>
    </tr>
    <tr>
      <td>Berlin</td>
      <td>Wednesday</td>
      <td>7:00 PM</td>
      <td>c-base</td>
      <td>Joschi Kuphal</td>
    </tr>
  </tbody>
</table>

<table>
  <caption>Website Performance Metrics</caption>
  <thead>
    <tr>
      <th>Site Type</th>
      <th>Average Load Time</th>
      <th>Lighthouse Score</th>
      <th>Carbon Footprint</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Static HTML/CSS</td>
      <td>0.8s</td>
      <td>98/100</td>
      <td>0.1g CO‚</td>
    </tr>
    <tr>
      <td>Jekyll Site</td>
      <td>1.2s</td>
      <td>95/100</td>
      <td>0.15g CO‚</td>
    </tr>
    <tr>
      <td>Hugo Site</td>
      <td>0.9s</td>
      <td>97/100</td>
      <td>0.12g CO‚</td>
    </tr>
    <tr>
      <td>WordPress</td>
      <td>3.5s</td>
      <td>72/100</td>
      <td>0.8g CO‚</td>
    </tr>
  </tbody>
</table>