Ví dụ
Thiết lập màu nền cho ba cột với thẻ <colgroup> và thẻ <col>:
<table>
<colgroup>
<col span="2" style="background-color:red">
<col style="background-color:yellow">
</colgroup>
<tr>
<th>ISBN</th>
<th>Tên sách</th>
<th>Giá</th>
</tr>
<tr>
<td style="color:#FFF">3476896</td>
<td style="color:#FFF">Zarathustra Đã Nói Như Thế</td>
<td>120 ngàn đồng</td>
</tr>
<tr>
<td style="color:#FFF">5476499</td>
<td style="color:#FFF">Buổi Hoàng Hôn Của Những Thần Tượng</td>
<td>48 ngàn đồng</td>
</tr>
</table>Kết quả:
| ISBN | Tên sách | Giá |
|---|---|---|
| 3476896 | Zarathustra Đã Nói Như Thế | 120 ngàn đồng |
| 5476499 | Buổi Hoàng Hôn Của Những Thần Tượng | 48 ngàn đồng |
Định nghĩa và cách dùng
Thẻ <colgroup> chỉ định một nhóm các cột trong bảng có định dạng như thế nào.
Thẻ <colgroup> hữu dụng khi áp định dạng lên toàn bộ các cột, thay vì lặp lại định dạng ở mỗi ô thuộc mỗi hàng.
Lưu ý: Thẻ <colgroup> phải là con của phần tử <table>, đứng đằng sau bất kỳ phần tử <caption> nào đứng đằng trước các phần tử <thead>, <tbody>, <tfoot> và <tr>.
Mẹo: Để xác định các thuộc tính khác nhau của một cột trong một <colgroup>, sử dụng thẻ <col> trong thẻ <colgroup>.
Trình duyệt hỗ trợ
| Thẻ | Chrome | IE | FireFox | Safari | Opera |
|---|---|---|---|---|---|
| <colgroup> | Có | Có | Có | Có | Có |
Sự khác nhau giữa HTML 4.01 và HTML5
Không thuộc tính nào thuộc HTML 4.01 được hỗ trợ trong HTML5.
Các thuộc tính
| Thuộc tính | Giá trị | Mô tả |
|---|---|---|
| align | left right center justify char |
Không hỗ trợ trong HTML5. Căn lề nội dung trong nhóm các cột |
| char | ký tự | Không hỗ trợ trong HTML5. Căn lề nội dung trong nhóm các cột tới một ký tự |
| charoff | số | Không hỗ trợ trong HTML5. Thiết lập số ký tự nội dung sẽ căn lề từ ký tự được chỉ định bởi thuộc tính char |
| span | số | Chỉ định số cột nên nhóm lại với nhau |
| valign | top middle bottom baseline |
Không hỗ trợ trong HTML5. Căn lề nội dung theo chiều dọc trong nhóm cột |
| width | pixels % chiều dài tương đối |
Không hỗ trợ trong HTML5. Chỉ định chiều rộng của nhóm cột |
Thiết lập CSS mặc định
Hầu hết các trình duyệt sẽ hiển thị phần tử <colgroup> với các giá trị mặc đinh sau:
colgroup {
display: table-column-group;
}