Chapter 5. Tables

HTML tables offer a detailed way to present tabular data, as well as a creative way to lay out the information in your web documents. The standard HTML model for tables is straightforward: a table is a collection of data arranged and related in rows and columns of cells. Most cells contain data values; others contain row and column headers that describe the data.

The HTML 4.0 table specification defines a number of tags and attributes for creating tables. Newly supported tags allow you to organize and display table data with great detail, and with the application of CSS style elements, table styles can be standardized across your documents.

The main tags that describe tables are: <table>, <caption>, <tr>, <th>, and <td>. The <table> tag surrounds the table and gives default specifications for the entire table such as background color, border size, and spacing between cells. The optional <caption> tag is placed within the <table> tags and provides a caption for the table. <tr> tags denote each row of the table and contain the tags for each cell within a row. <th> and <td> describe the table cells themselves, <th> being a header cell and <td> being a regular cell. <th> and <td> tags surround the information that is displayed within each table cell.

Table cells are defined across each row of a table. The number of cells in a row is determined by the number of <th> or <td> tags contained within a <tr>. If a table cell spans more than one row (using the rowspan attribute), ...

Get Webmaster in a Nutshell, Second Edition now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.