HTML Table Column Group
HTML Table Column Group is used to specify a group of one or more columns to apply specific formatting to these column groups.
<colgroup>
is the tag used to specify column group in HTML Table.
Examples
In the following example, we specify different background color for different columns using Column Group <colgroup>
tag.
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<style>
table, th, td {
border: 1px solid;
border-collapse: collapse;
}
</style>
</head>
<body>
<table>
<colgroup>
<col style="background:#facfd2">
<col style="background:#f5e6ab">
<col style="background:#b8e6bf">
</colgroup>
<thead>
<th>Name</th>
<th>Quantity</th>
<th>Available in (Months)</th>
</thead>
<tbody>
<tr>
<td>Apple</td>
<td>25</td>
<td>1</td>
</tr>
<tr>
<td>Banana</td>
<td>18</td>
<td>0.5</td>
</tr>
<tr>
<td>Cherry</td>
<td>36</td>
<td>3</td>
</tr>
</tbody>
</table>
</body>
</html>
Conclusion
In this HTML Tutorial, we learned about HTML Table Column Group, and how to use it to format columns, with examples.