Table Structure: table, tr, th, and td

Use an HTML table for information that has a meaningful relationship across rows and columns. Do not use tables to position page layouts; CSS Grid and Flexbox are built for that job.

<table>
  <tr>
    <th scope="col">Course</th>
    <th scope="col">Level</th>
    <th scope="col">Lessons</th>
  </tr>
  <tr>
    <td>HTML</td>
    <td>Beginner</td>
    <td>78</td>
  </tr>
  <tr>
    <td>JavaScript</td>
    <td>Intermediate</td>
    <td>52</td>
  </tr>
</table>

table is the container. Each tr is a row. A th is a header cell, and a td is a data cell. The scope attribute identifies column headers, helping assistive technology associate data with the correct heading.

Larger tables commonly use thead, tbody, and tfoot to group header, body, and footer rows. A table should have a clear purpose: visitors should be able to understand the relationships between rows and columns without relying on color or visual position alone.