|
The example of colgroup tag in HTML
<table border="1">
<colgroup>
<col align="right"></col>
<col align="left"></col>
</colgroup>
<tr>
<th>header_1</th>
<th>header_2</th>
</tr>
<tr>
<td>col_1</td>
<td>col_2</td>
</tr>
<tr>
<td>col_2_1</td>
<td>col_2_2</td>
</tr>
</table>
Working example of colgroup tag
| header_1 |
header_2 |
| col_1 |
col_2 |
| col_2_1 |
col_2_2 |
The HTML colgroup tag is used to define column group of table in webpage.
Colgroup tag may include col tag of table or it may work as individual tag with closing tag of colgroup. Colgroup tag is useful for apply common property to group of column in table.
Colgroup tag is written inside table tag and top of table tag.
Colgroup tag is supported by all web browsers. These web browsers are Internet Explorer, firefox, opera and google chrome.
Some attribute of colgroup tag is not supported by firefox, google chrome web browsers.
These attribute which are supported span and width. Other all attributes are not supported by these mention web browsers.
Colgroup tag supports common attribute and event attributes.
Colgroup tag Attribute
| Attribute |
Value |
Explaination |
| align |
left center right justify char |
Define the alignment of column |
| char |
Character |
alignment char, e.g. char=':' |
| charoff |
Length |
offset for alignment char |
| valign |
top middle bottom baseline |
Define vertical alignment attributes for cell contents |
| span |
NUMBER |
Define COL attributes affect N columns, |
| width |
NUMBER |
Define the width of a col tag |
Common Attribute of Colgroup Tag
| Attribute |
Value |
Explaination |
| id |
ID |
unique id document for element |
| class |
classname |
list of CSS classes |
| style |
StyleSheet |
associated style information of style tags |
| title |
Text |
information about an element shown on mouse over cursor |
| lang |
LanguageCode |
Language Code of the element |
| dir |
ltr rtl |
direction for weak/neutral text |
Events Attribute of Colgroup Tag
| Attribute |
Value |
Explaination |
| onclick |
event |
Event Fire on mouse button was clicked |
| ondblclick |
event |
Event Fire on a mouse button was double clicked |
| onmousedown |
event |
Event Fire on a mouse button was pressed down |
| onmouseup |
event |
Event Fire on a mouse button was released |
| onmouseover |
event |
Event Fire on a mouse was moved onto |
| onmousemove |
event |
Event Fire on a mouse was moved within |
| onmouseout |
event |
Event Fire on a mouse was moved away |
| onkeypress |
event |
Event Fire on a key was pressed and released |
| onkeydown |
event |
Event Fire on a key was pressed down |
| onkeyup |
event |
Event Fire on a key was released |
|