Example
Two colgroup elements that specify different alignment and style for the three columns in the table (notice that the first colgroup element spans two columns):<table width="100%" border="1">
<colgroup span="2" align="left"></colgroup>
<colgroup align="right" style="color:#0000FF;"></colgroup>
<tr>
<th>ISBN</th>
<th>Title</th>
<th>Price</th>
</tr>
<tr>
<td>3476896</td>
<td>My first HTML</td>
<td>$53</td>
</tr>
</table>
Definition and Usage
The <colgroup> tag is used to group columns in a table for formatting.The <colgroup> tag is useful for applying styles to entire columns, instead of repeating the styles for each cell, for each row.
The <colgroup> tag can only be used inside a table element.
Browser Support
The <colgroup> tag is supported in all major browsers.
Note: Firefox, Chrome, and Safari only support the span and width attributes of the colgroup element.
Differences Between HTML and XHTML
NONETips and Notes
Tips: Add the class attribute to the <colgroup> tag, and let CSS take care of alignment, widths, colors, etc.!Also have a look at the <col> tag.
Optional Attributes
DTD indicates in which HTML 4.01/XHTML 1.0 DTD the attribute is allowed. S=Strict, T=Transitional, and F=Frameset.Attribute | Value | Description | DTD |
---|---|---|---|
align | left right center justify char | Aligns the content in a column group | STF |
char | character | Aligns the content in a column group to a character | STF |
charoff | number | Sets the number of characters the content will be aligned from the character specified by the char attribute | STF |
span | number | Specifies the number of columns a column group should span | STF |
valign | top middle bottom baseline | Vertical aligns the content in a column group | STF |
width | pixels % relative_length | Specifies the width of a column group | STF |
Standard Attributes
The <colgroup> tag supports the following standard attributes:Attribute | Value | Description | DTD |
---|---|---|---|
class | classname | Specifies a classname for an element | STF |
dir | rtl ltr | Specifies the text direction for the content in an element | STF |
id | id | Specifies a unique id for an element | STF |
lang | language_code | Specifies a language code for the content in an element | STF |
style | style_definition | Specifies an inline style for an element | STF |
title | text | Specifies extra information about an element | STF |
xml:lang | language_code | Specifies a language code for the content in an element, in XHTML documents | STF |
Event Attributes
The <colgroup> tag supports the following event attributes:Attribute | Value | Description | DTD |
---|---|---|---|
onclick | script | Script to be run on a mouse click | STF |
ondblclick | script | Script to be run on a mouse double-click | STF |
onmousedown | script | Script to be run when mouse button is pressed | STF |
onmousemove | script | Script to be run when mouse pointer moves | STF |
onmouseout | script | Script to be run when mouse pointer moves out of an element | STF |
onmouseover | script | Script to be run when mouse pointer moves over an element | STF |
onmouseup | script | Script to be run when mouse button is released | STF |
onkeydown | script | Script to be run when a key is pressed | STF |
onkeypress | script | Script to be run when a key is pressed and released | STF |
onkeyup | script | Script to be run when a key is released | STF |