【问题标题】:Apply table style to all columns except first column将表格样式应用于除第一列之外的所有列
【发布时间】:2013-11-08 07:36:57
【问题描述】:

我正在使用 JavaScript 动态创建 HTML 表格,以便列数可以变化(1 到 10 之间)。 CSS中有没有一种方法可以自动将类样式应用于该表的除第一列之外的所有列,而无需手动为每一列添加类?

我认为使用 nth-child 可能有一个技巧,但无法使其正常工作。

【问题讨论】:

  • 您可以使用表格单元格的默认样式,然后覆盖第一列的样式td:first-child

标签: html css class html-table


【解决方案1】:

有几种方法。其中之一是

th:nth-child(n+2), td:nth-child(n+2) { ... }

另一个:

th + th, th + td, td + th, td + td { ... }

这些的浏览器覆盖率很好,但不是 100%。要覆盖所有支持 CSS 的浏览器,恐怕您需要间接执行此操作:

th, td { /* your settings here */ }
th:first-child, td:first-child { /* “overwriting” settings here */ }

这里的“覆盖设置”是指覆盖第一条规则中设置的设置。但这需要有关第一列所需渲染的信息。

【讨论】:

    【解决方案2】:

    试试这个:

    td:not(:first-child){color:green;}
    

    Here is the fiddle.

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2016-02-05
      • 2013-03-26
      • 2016-12-02
      • 2017-05-22
      • 1970-01-01
      • 1970-01-01
      • 2014-12-21
      相关资源
      最近更新 更多