<col> calls for a column within a column group
<col> calls out individual columns from a column group. You can apply styles to groups of columns and the individual columns in that group.
The span attribute from col element allows you to represent more than one column in the colgroup. The col element represents a single column if you don't use the span attribute.
<!DOCTYPE HTML>
<html>
<head>
<title>Example</title>
<style>
#colgroup1 {background-color: red}
#col3 {background-color: green; font-size:small}
</style>
</head>
<body>
<table>
<colgroup id="colgroup1">
<col id="col1And2" span="2"/>
<col id="col3"/>
</colgroup>
<colgroup id="colgroup2" span="2"/>
<thead>
<tr>
<th>Column 1</th><th>Column 2</th><th>Column 3</th><th colspan="2">Column 4</th>
</tr>
</thead>
<tbody>
<tr>
<th>A:</th><td>B</td><td>C</td><td>D</td><td>E</td>
</tr>
<tr>
<th>F:</th><td>G</td><td>H</td><td>I</td><td>J</td>
</tr>
<tr>
<th>K:</th><td>K</td><td colspan="2" rowspan="2">L</td><td>M</td>
</tr>
<tr>
<th rowspan="2">O:</th><td>P</td><td rowspan="2">Q</td>
</tr>
<tr>
<td>X</td><td>Y</td><td>Z</td>
</tr>
</tbody>
<tfoot>
<tr>
<th colspan="5">Line</th>
</tr>
</tfoot>
</table>
</body>
</html>