Skip to content

Table

Organize elements using rows and columns

  • Lesson
  • 1 min read
  • 3 of 6 in this chapter

The whole table should be enclosed in table tags:

HTML
<table>

</table>

Each horizontal table row is defined by the tr tags. Our table has three rows:

HTML
<table>
    <tr>

    </tr>
    <tr>

    </tr>
    <tr>

    </tr>
</table>

Finally, each data cell is eclosed in either th (for table headings) or td (for table data) tags:

HTML
<table>
    <tr>
        <th>Name</th>
        <th>Favorite color</th>
    </tr>
    <tr>
        <td>Shrek</td>
        <td>green</td>
    </tr>
    <tr>
        <td>Fiona</td>
        <td>blue</td>
    </tr>
    <tr>
        <td>Lord Farquaad</td>
        <td>red</td>
    </tr>
</table>