Colgroup - Table Column Group

The Web Design Group

colgroup - Table Column Group
Syntax <colgroup>...</COLGROUP>
Attribute Specifications
  • span=Number (number of columns in group)
  • width=MultiLength (width of each column)
  • align=[ "left" | "center" | "right" | "justify" | "char" ] (horizontal alignment of cells in group)
  • char=Character (alignment character for cells)
  • charoff=Length (alignment character offset)
  • valign=[ "top" | "middle" | "bottom" | "baseline" ] (vertical alignment of cells in group)
  • common attributes
Contents Zero or more col elements
Contained in table

The colgroup element defines a column group in a table. If used, colgroup must be after the optional caption and before the optional thead in the table. The structural divisions defined by colgroup allow authors to easily suggest a presentation for groups of columns through style sheets.

colgroup's span attribute defines the number of columns in the group; the default value is 1. A number of other attributes are permitted on colgroup, and these are shared among the cells of the group. colgroup may contain col elements that define attributes for the cells of individual columns, overriding attributes defined for the column group. The span attribute should not be used if the colgroup contains any col elements.

The next example features three column groups to structurally divide the table into three parts. The first part is a single column that gives the description of a character. The second part consists of three columns giving different ways of representing the character in XHTML. The third part consists of three columns with renderings of the character in the user's browser.

<table summary="This table gives the character entity reference, decimal character reference, and hexadecimal character reference for 8-bit Latin-1 characters, as well as the rendering of each in your browser."> <colgroup /> <colgroup span="3" /> <colgroup span="3" /> <thead> <tr> <th scope="col" rowspan="2">Character</th> <th scope="col" rowspan="2">Entity</th> <th scope="col" rowspan="2">Decimal</th> <th scope="col" rowspan="2">Hex</th> <th scope="colgroup" colspan="3">Rendering in Your Browser</th> </tr> <tr> <th scope="col">Entity</th> <th scope="col">Decimal</th> <th scope="col">Hex</th> </tr> </thead> <tbody> <tr> <td scope="row">non-breaking space</td> <td>&amp;nbsp;</td> <td>&amp;#160;</td> <td>&amp;#xA0;</td> <td>&nbsp;</td> <td>&#160;</td> <td>&#xA0;</td> </tr> ... </tbody> </table>

In place of the <colgroup span="3" /> tag in the preceding example, a colgroup with three col elements could have been used:

<colgroup> <col class="entity" /> <col class="decimal" /> <col class="hex" /> </colgroup>

Here we have used the class attribute to distinguish the individual columns of the group, allowing us to easily suggest different presentations for the columns through style sheets.

colgroup also takes a number of presentational attributes, many of which cannot be completely replaced by style sheets. Since few browsers support colgroup, authors may wish to specify these attributes on the td or th elements instead.

The width attribute specifies a width for each column in the group. The value must be a number in pixels, a percentage of the table width, or a relative length expressed as i* where i is an integer. A column with width="3*" will be allotted three times the width of a column with width="1*". The value 0* is equivalent to the minimum width necessary for the column's contents.

The align attribute specifies the horizontal alignment for each cell in the column group. Possible values are left, center, right, justify, and char. align="char" aligns a cell's contents on the character given in the char attribute. The default value for the char attribute is the decimal point of the current language--a period in English. The charoff attribute specifies the offset to the first occurrence of the alignment character. The attribute's value is a number in pixels or a percentage of the cell's width; charoff="50%" centers the alignment character horizontally in a cell.

The valign attribute specifies the vertical position of a cell's contents. Possible values are:

  • top, which positions data at the top of the cell;
  • middle, the default value, which centers the cell data vertically;
  • bottom, which positions data at the bottom of the cell;
  • baseline, which specifies that the first line of each cell in the row with valign="baseline" should occur on a common baseline.

More Information

  • colgroup in W3C HTML 4.01 Recommendation
Maintained by Liam Quinn <liam@htmlhelp.com>

Web Design Group ~ XHTML 1.0 Reference ~ Elements by Function ~ Elements Alphabetically

This document is a modification of Liam Quinn's HTML 4.0 Reference to describe XHTML 1.0. The modifications were done by Greg Baker. Copyright © 1998-2004 by Liam Quinn. This material may be distributed only subject to the terms and conditions set forth in the Open Publication License, v1.0 or later (the latest version is presently available at http://www.opencontent.org/openpub/).

Từ khóa » Html Colgroup Scope