HTML 表格 <colgroup> 标签
<colgroup> 标签用于设置表格中特定列的样式。
HTML 表格 <colgroup> 标签
如果要为表格的前两列设置样式，请使用 <colgroup> 和 <col> 标签。
| 周一 | 周二 | 周三 | 周四 | 周五 | 周六 | 太阳 |
|---|---|---|---|---|---|---|
| 1 | 2 | 3 | 4 | 5 | 6 | 7 |
| 8 | 9 | 10 | 11 | 12 | 13 | 14 |
| 15 | 16 | 17 | 18 | 19 | 20 | 21 |
| 22 | 23 | 24 | 25 | 26 | 27 | 28 |
<colgroup> 标签应作为列规格的容器。
每个组由 <col> 标签指定。
span 属性指定了多少列将应用样式。
style 属性指定了要为列设置的样式。
注意： colgroup 可用的 CSS 属性非常有限。
示例
<table>
<colgroup>
<col span="2" style="background-color: #D6EEEE">
</colgroup>
<tr>
<th>周一</th>
<th>周二</th>
<th>周三</th>
<th>周四</th>
...
自己动手试一试 »
注意： <colgroup> 标签必须是 <table> 元素的子元素，并且应放在任何其他表格元素（如 <thead>、<tr>、<td> 等）之前，但在 <caption> 元素（如果存在）之后。
允许的 CSS 属性
只有非常有限的 CSS 属性允许在 colgroup 中使用
width 属性
visibility 属性
background 属性
border 属性
所有其他 CSS 属性都将对您的表格无效。
多个 Col 元素
如果要为更多列设置不同的样式，请在 <colgroup> 中使用更多 <col> 元素
示例
<table>
<colgroup>
<col span="2" style="background-color: #D6EEEE">
<col span="3" style="background-color: pink">
</colgroup>
<tr>
<th>周一</th>
<th>周二</th>
<th>周三</th>
<th>周四</th>
...
自己动手试一试 »
空的 Colgroups
如果要设置表格中间列的样式，请在前面的列之前插入一个“空”的 <col> 元素（不带样式）
示例
<table>
<colgroup>
<col span="3">
<col span="2" style="background-color: pink">
</colgroup>
<tr>
<th>周一</th>
<th>周二</th>
<th>周三</th>
<th>周四</th>
...
自己动手试一试 »
隐藏列
您可以使用 visibility: collapse 属性隐藏列
示例
<table>
<colgroup>
<col span="2">
<col span="3" style="visibility: collapse">
</colgroup>
<tr>
<th>周一</th>
<th>周二</th>
<th>周三</th>
<th>周四</th>
...
自己动手试一试 »
