<colgroup>
HTML <colgroup> Tag
The HTML <colgroup> tag is used to specify a group of columns with common properties inside a table. The tag can include several <col> elements that define column properties.
The <colgroup> tag is nested inside a <table> tag, before <thead>, <tbody>, <tfoot> and <tr>, and after <caption>, if it is used (in the <caption> tag, the table name is inserted).
A single HTML table can include several <colgroup> tags.
Syntax
Syntax
The <colgroup> tag comes in pairs. The content is written between the opening (<colgroup>) and closing (</colgroup>) tags.
Example of the HTML <colgroup> tag:
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
<style>
table, th, td {
border: 1px solid #666;
}
</style>
</head>
<body>
<table>
<colgroup>
<col span="2" style="width:20%; background-color:#eee;">
<col style="width:10%; background-color:#8ebf42;">
</colgroup>
<tr>
<th>Name</th>
<th>Gender</th>
<th>Age</th>
</tr>
<tr>
<td>Mary Nicolson</td>
<td>female</td>
<td>19</td>
</tr>
<tr>
<td>John Johnson</td>
<td>male</td>
<td>23</td>
</tr>
</table>
</body>
</html>
Result
Attributes
Attributes
Attribute | Value | Description |
---|---|---|
align | Sets the alignment of the column contents. | |
Not supported in HTML5. | ||
left | Aligns to the left. | |
right | Aligns to the right. | |
center | Aligns the center. | |
justify | Stretches the lines so that each line has equal width. | |
char | Aligns a special character with a minimum offset, which is defined by the char and charoff | |
attributes. | ||
char | character | Aligns the contents of the column with the specified character. |
Used only if the attribute align=“char”. | ||
Not supported in HTML5. | ||
charoff | number | Shifts the contents of the cell relative to the specified character set as the value of the attribute to the right (positive values) or to the left (negative values). Used only if the attribute align=“char”. |
Not supported in HTML5. | ||
span | number | Sets the number of columns, the characteristics of which are defined by the <col> element. The number must be a positive integer. If the parameter is not specified, the default value is 1. |
valign | Aligns the content vertically. | |
top | Aligns at the top of the line. | |
bottom | Aligns the bottom edge. | |
middle | Aligns in the middle. | |
baseline | Aligns the baseline.Not supported in HTML5. | |
width | %pixelsrelative_length | Sets the width of the column. |
Not supported in HTML5. |
The <colgroup> tag also supports the Global Attributes and the Event Attributes.