HTML and CSS Reference
In-Depth Information
Listing 7-18.
A table including a
colgroup
and two
col
elements
<table>
<colgroup>
<col>
<col>
</colgroup>
<tr>
<th scope="row">Utility Belts</th>
<td>9</td>
</tr>
</table>
You may define multiple column groupings in your table if the size of the data set and organization of the
table warrants. Listing 7-19 shows an example of a complex table with multiple
colgroup
elements.
Listing 7-19.
A complex data table including multiple
colgroup
elements
<table>
<colgroup>
<col>
</colgroup>
<colgroup span="2">
<colgroup>
<col>
<col>
</colgroup>
<thead>
<tr>
<th scope="col">Product</th>
<th colspan="2" scope="col">Quantity</th>
<th colspan="2" scope="col">Price</th>
</tr>
<tr>
<td></td>
<th scope="col">New</th>
<th scope="col">Used</th>
<th scope="col">New</th>
<th scope="col">Used</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">Utility Belts</th>
<td>9</td>
<td>27</td>
<td>6</td>
<td>23</td>
</tr>
</tbody>
</table>
