<table>
A table made of rows (`<tr>`) and cells.
Syntax
<table>
<tr><th>Heading</th></tr>
<tr><td>Cell</td></tr>
</table>Examples
A table with column headers:
<table>
<tr><th>Drink</th><th>Price</th></tr>
<tr><td>Tea</td><td>$2.50</td></tr>
<tr><td>Coffee</td><td>$4.00</td></tr>
</table>Borders are added in CSS:
<style>
table { border-collapse: collapse; }
th, td { border: 1px solid silver; padding: 6px 12px; }
</style>
<table>
<tr><th>Drink</th><th>Price</th></tr>
<tr><td>Tea</td><td>$2.50</td></tr>
</table>Notes
Tables are for data. Do not use them to lay out page blocks — that is what flexbox and grid are for. Without border-collapse: collapse neighbouring cells get double borders.
See also
- <td>, <th> — Table cells: `<td>` holds data, `<th>` is a header cell.
- <thead>, <tbody>, <tfoot> — Groups of table rows: the head, the body and the footer.
- <caption> — The title of a table.
- <colgroup>, <col> — Describes table columns so you can give them a width or background.
Related recipes
In the tutorial
- Tables — Tables in HTML — rows and cells, column headers, thead, tbody, tfoot and caption, merging cells.