HTML and CSS Reference
In-Depth Information
10.1. The Standard Table Model
The standard model for tables is fairly straightforward: a table is a collec-
tion of numbers and words arranged in rows and columns of
cells
. Most
cells contain the data values; others contain row and column headers
that describe the data.
You define a table and include all of its elements between the
<table>
tag and its corresponding
</table>
end tag. Table elements, including
data items, row and column headers, and captions, each have their own
markup tags. Working from left to right and top to bottom, you define, in
sequence, the header and data for each column cell across and down the
table.
The latest standards also provide a rich collection of tag attributes, many
of which once were popular extensions to HTML as supported by the
popular browsers. They make your tables look good, by enabling special
alignment of the table values and headers, borders, table rule lines, and
automatic sizing of the data cells to accommodate their content, among
other capabilities. The various popular browsers have slightly different
sets of table attributes; we'll point out those variations as we go.
10.1.1. Table Contents
You can put nearly anything you might have within the body of an HTML
or XHTML document inside a table cell, including images, forms, rules,
headings, and even another table. The browser treats each cell as a win-
dow unto itself, flowing the cell's content to fill the space, but with some
special formatting provisions and extensions.
10.1.2. An Example Table
Here's a quick example that should satisfy your itching curiosity to see
what an HTML table looks like in a source document and when finally
rendered, as shown in
Figure 10-1
. More importantly, it shows you the
basic structure of a table, from which you can infer many of the ele-
