HTML and CSS Reference
In-Depth Information
<td id="jeff_croft">Jeff Croft</td>
<td headers="jeff_croft affiliation">World Online</td>
<td headers="jeff_croft url"></td>
<td id="ian_lloyd">Ian Lloyd</td>
<td headers="ian_lloyd affiliation">Accessify</td>
<td headers="ian_lloyd url"></td>
<td id="dan_rubin">Dan Rubin</td>
<td headers="dan_rubin affiliation">Webgraph</td>
<td headers="dan_rubin url"></td>
As this markup is far more complex than using the scope attribute, it's always best to use
scope where possible—and it works great for most cases. Only quite complex tables require
the use of the headers attribute.
The thead, tfoot, and tbody Elements
Rows within a table can be optionally grouped in a table head, table foot, and one or more
table body sections, using the thead , tfoot , and tbody elements, respectively. Typically, the
thead element is used to contain the header rows of the table, the tbody element is used to
hold the main content, and the tfoot element is used to collect any totals and similar “closing”
information. By including these divisions in your markup, you provide the “hooks” necessary
to create common and often desirable presentational effects, and also allow the user agent to
do logical things, such as including the same header and footer on each page of a printed
version of your table. It is worth remembering that both the thead and tfoot elements should
appear above any tbody elements in your markup. The browser will still display the tfoot ele-
ment at the bottom of the table where it belongs.
Our example table doesn't have data appropriate for multiple tbody elements or a tfoot
element, but as it gets a bit more complex, it may. Consider the following:
<table summary="A small table displaying the names,
affiliations, web addresses, and roles of the
authors and editors of Pro CSS Techniques.">
<caption>Pro CSS Techniques authors and editors</caption>
<th scope="col">Name</th>
<th scope="col">Affiliation</th>
<th scope="col" abbr="URL">Website URL</th>
<th scope="col">Role</th>
<tbody id="authors">
Search WWH ::

Custom Search