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ẻ <col> chỉ định thuộc tính cột cho mỗi cột trong phần tử <colgroup>.
Thẻ <col> rất hữu dụng cho việc áp dụng styles cho tất cả các cột, thay cho việc phải lập lại style cho mỗi ô, ở các hàng.
Trình duyệt hỗ trợ
Thẻ | Chrome | IE | FireFox | Safari | Opera |
---|---|---|---|---|---|
<col> | 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.
Sự khác biệt giữa HTML và XHTML
Trong HTML, thẻ <col> không có thẻ đóng.
Trong XHTML, thẻ <col> phải được đóng đúng cách.
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. Chỉ định lề của nội dung liên quan đến phần tử <col> |
char | ký tự | Không hỗ trợ trong HTML5. Chỉ định lề của nội dung liên quan đến phần tử <col> tới một ký tự |
charoff | số | Không hỗ trợ trong HTML5. Chỉ định số lượng ký tự nội dung sẽ được căn lề từ ký tự được chỉ định bởi thuộc tính char |
span | số | Chỉ định số lượng cột mà một phần tử <col> gom lại chung thuộc tính |
valign | top middle bottom baseline | Không hỗ trợ trong HTML5. Chỉ định lề theo chiều thẳng đứng của nội dung liên quan đến phần tử <col> |
width | % pixels chiều dài tương đối | Không hỗ trợ trong HTML5. Chỉ định chiều rộng của phần tử <col> |
Các 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ử <col> với các giá trị mặc định sau:
col {
display: table-column;
}