Html 通过CSS隐藏表格第一列的方法

此代码适用于IE以外的浏览器：

table.tbl.tr.td:first-child { display: none; }

---

我应该用什么来让它在所有浏览器上工作？

好吧，简单的回答是，在早期版本的IE中，你无法让它工作。我猜IE8可以处理它。有一种叫做表达式的CSS黑客可以解决这个问题，但是表达式是个糟糕的主意，我甚至不会告诉你怎么做

---

保持CSS的原样，如果客户端在IE上，则在DOMReady上添加一个JavaScript，可以为您执行相同的操作。

遗憾的是，所能做的很少。看起来很诱人，但浏览器的处理方式不同。

---

您可能需要为每个单元格手动添加一个类，或者使用。

不幸的是，旧版本的IE不支持CSS中的：first child。我不知道IE8。无论如何，如果您不想使用javascript，并且可以访问html，那么将“first”类分配给表中的第一列tds是非常容易的。因此，html将如下所示：

<table>
  <tr>
    <td class="first">...</td>
    <td>..</td>
    ..
  </tr>
</table>

---

你上面的表达根本不起作用

table.tbl.tr.td

将选择定义如下的表元素：

，但不选择其单元格

应该是这样的，Internet Explorer 6以上的几乎所有浏览器都支持：

table.tbl tr td:first-child { display: none; }

---

对于IE，您应该/可以为表列设置col和colspan，然后将它们隐藏在CSS中

据我所知，这只适用于IE，它（值得赞扬的是，这一次）拥有col和colspan的最佳实现。其他浏览器在这里很弱（但这只是规范中很小的一部分）

隐藏第一列

table td:nth-child(1){ display:none;} 

在Chrome+FireFox中正常工作，但在IE中不正常

使用Jquery处理跨平台问题，方法是：

$('table td:nth-child(1)').hide();

适用于所有浏览器

只需使用：

table td:nth-child(n){
   display:none;
}

其中n是要隐藏的列

下面是一个使用示例：

table.marks.hideSubject       {td:nth-child(1) {display: none;}}
table.marks.hideDescription   {td:nth-child(2) {display: none;}}
table.marks.hideMark          {td:nth-child(3) {display: none;}}
table.marks.hideRank          {td:nth-child(4) {display: none;}}

---

通过使用cssnth-child，我们可以隐藏列。 只需指定表ID和列索引。
在本例中，我隐藏了表的最后3列

<style>
    #ID_OF_THE_TABLE tr *:nth-child(10),tr *:nth-child(9),tr *:nth-child(8){
        display: none;
    }
</style>

#表tr*：第n个子（10）、tr*：第n个子（9）、tr*：第n个子（8）的ID{
显示：无；
}

对我有效的解决方案是：

td { display: none; }
td + td { display: table-cell; }

不需要JavaScript，不需要额外的类

---

干杯

顺便问一下，什么是

table.tbl.tr.td

-这是个错误吗？使用

display:none

，就像Linus的回答一样。或者使用jQuery，例如，

$（'table td:first child'）.hide（）

这是我所知道的唯一一种跨浏览器兼容的方式+1.

td { display: none; }
td + td { display: table-cell; }