Question

我有一个动态表，在这个jsfiddle链接中是一个部分的例子

我想添加一个合适的CSS来替换按日期列的颜色，我正在寻找像css这样的CSS：

tr:nth-child(4n) td { }

但是我不知道应该更改在日期下为整个列单元着色的4n迭代。

这可能是最好的方法吗？

Answer 1

您的代码将影响每四行中的所有单元格。

你想要的是标题行每隔一列交替颜色，数据行交替每6列的第4，第5和第6列。

thead tr th:nth-child(2n) {
    background-color: #ccf;
}

tbody tr th:nth-child(6n + 4),
tbody tr th:nth-child(6n + 5),
tbody tr th:nth-child(6n + 6), 
tbody tr td:nth-child(6n + 4),
tbody tr td:nth-child(6n + 5),
tbody tr td:nth-child(6n + 6) {
    background-color: #ccf;
}

Answer 2

如果要为列着色，则需要将选择器的:nth-child(n)部分移动到td，并删除字母'n'：

tr td:nth-child(1)

快速编辑你的小提琴，这是你的意思吗？：

http://jsfiddle.net/99Z5Q/

表格替换n列CSS颜色

2 个答案: