HTML <colgroup> Tag
To define a group of columns within an HTML table, the HTML <colgroup> tag is used. It is also used to apply different properties in an HTML table, where the HTML <colgroup> tag acts as a parent container of one or more <col> elements. The <colgroup> tag is placed after the <caption> tag within the <table> element. It is placed before the <th> or <td> elements.
Syntax:
<colgroup>......</colgroup>
Example:
<!DOCTYPE html>
<html>
<head>
<style>
table, th, td {
border: 1px solid brown;
}
</style>
</head>
<body>
<table width="400">
<caption>Students Details</caption>
<colgroup>
<col style="background-color:lightgray">
<col span="2" style="background-color:lightyellow">
</colgroup>
<tr>
<th>ID</th>
<th>NAME</th>
<th>SUBJECT</th>
</tr>
<tr>
<td>101</td>
<td>Happy Singh</td>
<td>English</td>
</tr>
<tr>
<td>201</td>
<td>Smiley Das</td>
<td>French</td>
</tr>
<tr>
<td>301</td>
<td>Joy Gupta</td>
<td>Hindi</td>
</tr>
</table>
</body>
</html>
Explanation:
In the above example, we are using the HTML <colgroup> tag to apply different properties in an HTML table. It acts as a container for one or more <col> elements.
Tag-specific Attributes:
| Attribute | Value | Uses | HTML5 |
| align | left
right center justify char |
Used to define the content alignment related to a column group. | Not supported in HTML5. |
| char | character | Used to define the content alignment related to a column group to a character. | Not supported in HTML5. |
| charoff | number | The character specified by the char attribute defines the number of characters with the content that will be aligned. | Not supported in HTML5. |
| span | number | Used to define the number of columns which a column group should span. | |
| valign | top
middle bottom baseline |
Used to define the vertical content alignment related to a column group. | Not supported in HTML5. |
| width | pixels
relative_length |
Used to define the width of a column group. | Not supported in HTML5. |
Global Attributes:
All the Global attributes are supported by the HTML <colgroup> tag.
Event Attributes:
All the Event attributes are supported by the HTML <colgroup> tag.
Supporting Browsers:
Chrome, IE, Firefox, Opera, and Safari.