.hide { visibility: collapse; }
 
.show { visibility: visible; }

我试图在< col>上设置这些样式对应于我要隐藏/显示的列的元素：

<table>
  <thead>
    <tr>
      <th>Column 1</th>
      <th>Column 2</th>
      ...
    </tr>
  </thead>
  <colgroup>
    <col class="hide">
    <col>
    ...
  </colgroup>
  <tbody>
    <tr>
      <td>Row 1 Column 1</td>
      <td>Row 1 Column 2</td>
    </tr>
    ...
  </tbody>
</table>

但是,它似乎只适用于Firefox,但不适用于Safari或Chrome. Safari和Chrome是否需要特殊处理？我试图避免遍历所有行并修改每个对应的< td>上的CSS类/样式,并且表中的列数很大,所以我想避免每列创建一个CSS类.是否有任何可靠的方法可以通过更改< col>上的CSS类来跨浏览器隐藏/显示列