A Complete Guide to Web Design

Affecting Table Appearance 181

Tables

Affecting Table Appearance

Web Design in a Nutshell, eMatter Edition

Column groups

Column groups create structural divisions within a table. This allows the columns
created withand tags to be addressed as a group, usually for style and
formatting purposes.

Thetag delimits a conceptual group of columns. The number of
columns included in the group is indicated with thespanattribute. You can set
the width of every column in the group (using pixel measurements, percentages,
or relative values) with thewidth attribute.

The element is used to apply attribute specifications across several tables
without actually grouping them together structurally or conceptually. Like

, you can specify the span (number of affected columns) and width
(in pixels, percentages, or relative values) within the tag.

Sample HTML

The following is a bare-bones example of how row and column groups would be
integrated into the HTML table structure (with its resulting table display in a
browser). Figure 10-4 shows the result. Note again that proper support for row
and column groups and their attributes is rare as of this writing, however, it may
be useful to be familiar with this structure in the future.

<TABLE BORDER=1>

<CAPTION>Table Description</CAPTION>

<COLGROUP width=100>

<COL>

<COL>

</COLGROUP>

<COLGROUP width=50>

<THEAD valign="top">

<TR>

<TH>Heading 1</TH><TH>Heading 2</TH><TH>Heading 3</TH>

</TR>

</THEAD>

<TFOOT>

<TR>

<TH>Footer 1</TH><TH>Footer 2</TH><TH>Footer 3</TH>

</TR>

</TFOOT>

<TBODY>

<TR>

<TH>Cell Data 1</TH><TH>Cell Data 2</TH><TH>Cell Data 3</TH>

</TR>

</TBODY>

</TABLE>

Affecting Table Appearance

The HTML table standard provides many tags for controlling the display of tables.
Bear in mind that, as with most formatting tags, browsers have their own way of
interpreting your instructions, so results may vary among browser releases and