Tables provide a way to arrange data into rows and columns. Browsers normally render a table as a rectangular grid of cells.
Header 1 | Header 2 | Header 3 |
Cell 1 | Cell 2 | Cell 3 |
Cell 4 | Cell 5 | Cell 6 |
If no formatting is specified, browsers by default render table elements as above.
HTML with CSS, though, allows us to specify how a table may be rendered: by adding the HTML class attribute to the table structure above, and by defining styles for the given CSS class. For particulars, see Using Style Sheets.
Header 1 | Header 2 | Header 3 |
Cell 1 | Cell 2 | Cell 3 |
Cell 4 | Cell 5 | Cell 6 |
Tables may also be used to layout document content, such as the content on this page.
To construct a table, we use the TABLE element. Both the start and end tags are required.
<table>
... table definition elements ...
</table>
It is then used to contain all other elements that make up the properties and content of a table.