Question

我跟随colgroup无法正常工作。

<colgroup class="" style="background-color:#FF0000;"></colgroup>

请参阅此jsfiddle。我在colgroup上的样式不起作用。

Answer 1

您可以在colgroup上设置的大多数属性都不会产生影响，因为根据定义，表格单元格从tr元素（行）继承属性，而不是列或列组（在某种程度上）有继承）。

在CSS中直接在单元格元素上设置属性。例如，要设置前两列的背景颜色，假设单元格仅使用td标记，请使用

td:first-child, td:first-child + td {
  background: #f00;
  color: #fff;
}

Answer 2

以下是colgroup的示例：

<html> <body>

<table width="100%" border="1">   <colgroup style="background-color:#22FF22;"></colgroup>   <colgroup style="background-color:#888888;"></colgroup>   <colgroup style="background-color:#FF0000;"></colgroup>

  <tr>
    <th>A</th>
    <th>B</th>
    <th>C</th>
  </tr>  
  <tr>
    <td>D</td>
    <td>E</td>
    <td>F</td>  
 </tr>  
 <tr>
    <td>G</td>
    <td>H</td>
    <td>I</td> 
 </tr>
</table>

</body> </html>

如果您的代码有点不同，请告诉我们更多代码要适当地进行修复..

colgroup上的样式不起作用

2 个答案: