HTML Tables
Introduction
The HTML <table> element allows web authors to display tabular data (such as text, images, links, other tables, etc.) in a two dimensional table with rows and columns of cells.
Syntax
<table></table><thead></thead><tbody></tbody><tfoot></tfoot><tr></tr><th></th><td></td>
Remarks
The various table elements and their content attributes together define the table model. The <table> element is the container element for table models/tabular data. Tables have rows, columns, and cells given by their descendants. The rows and columns form a grid; a table's cells must completely cover that grid without overlap. The list below describes the various elements in the table model:
<table>- The container element for table models/tabular data.<table>represents data with more than one dimension in the form of a table.<caption>- Table caption or title (Like afigcaptionto afigure)<col>- A column (a no-content element)<colgroup>- A grouping of columns<thead>- Table header (only one)<tbody>- Table body / content (multiple are okay)<tfoot>- Table footer (only one)<tr>- Table row<th>- Table header cell<td>- Table data cell
Semantically, tables are meant for holding tabular data. You can think of it as a way to display and describe data that would make sense in a spreadsheet (columns and rows).
Using tables for layout is not recommended. Instead, use CSS rules for layout and formatting, including display: table.
One notable exception typically displayed in the industry regarding using <table> layout is in regards to HTML email: some email clients, including Outlook, rolled back to older rendering engines after Microsoft lose their monopoly case vs. the EU. In order for Microsoft to make IE not part of the OS, they simply rolled back Outlook's rendering engine to an earlier version of Trident. This rollback simply doesn't support modern web technologies, so using <table> based layouts for HTML email is the only way to ensure cross-browser/platform/client compatibility.
