二维码

HTML 表格并列组

HTML 表格并列组

该元素用于设置特定样式 表的列。<colgroup>

HTML 表格并列组

如果要设置表前两列的样式,请使用 和 元素。<colgroup>``<col>

该元素应用作列的容器 规格。<colgroup>

每个组都指定一个元素。<col>

该属性指定获取样式的列数。span

该属性指定要为列提供样式。style

注意: [colgroup 的合法 CSS 属性]选择非常有限。

1
2
3
4
5
6
7
8
9
10
<table>  
  <colgroup>
    <col span="2" style="background-color: #D6EEEE">
  </colgroup>
  <tr>
    <th>MON</th>
    <th>TUE</th>
    <th>WED</th>
    <th>THU</th>
...

注意: 标记必须是 元素的子元素,应放置 在任何其他表元素(如 、 等)之前,但在元素之后,如果 目前。<colgroup>``<table>``<thead>``<tr>``<td>``<caption>

合法的 CSS 属性

允许在 colgroup 中使用的 CSS 属性选择非常有限:

[width]属性 属性
属性 属性

[visibility]``[background]``[border]

所有其他 CSS 属性对表没有影响。

多个 col 元素

如果要设置更多具有不同样式的列的样式,请在 :<col>``<colgroup>

1
2
3
4
5
6
7
8
9
10
11
<table>  
  <colgroup>
    <col span="2" style="background-color: #D6EEEE">
    <col span="3" style="background-color: pink">
  </colgroup>
  <tr>
    <th>MON</th>
    <th>TUE</th>
    <th>WED</th>
    <th>THU</th>
...

空并列

如果需要帮助, 要设置表格中间列的样式,请插入一个“空”元素(没有 styles) 之前的列:<col>

1
2
3
4
5
6
7
8
9
10
11
<table>  
  <colgroup>
    <col span="3">
    <col span="2" style="background-color: pink">
  </colgroup>
  <tr>
    <th>MON</th>
    <th>TUE</th>
    <th>WED</th>
    <th>THU</th>
...

隐藏列

您可以使用以下属性隐藏列:visibility: collapse

1
2
3
4
5
6
7
8
9
10
11
<table>  
  <colgroup>
    <col span="2">
    <col span="3" style="visibility: collapse">
  </colgroup>
  <tr>
    <th>MON</th>
    <th>TUE</th>
    <th>WED</th>
    <th>THU</th>
...