jquery - 表格交替 n 列 CSS 颜色

标签 jquery html css twitter-bootstrap-3 css-tables

我有一个动态表,在这个 jsfiddle 链接中是其中一部分的示例

http://jsfiddle.net/Dta7K/

我想添加一个适当的 CSS 来按日期列交替颜色,我正在寻找像这样的 CSS:

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

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

哪种方法最好?

最佳答案

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

您想要的是标题行每隔一列交替颜色,数据行每隔 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;
}

关于jquery - 表格交替 n 列 CSS 颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21638496/

相关文章:

javascript - 选中/取消选中复选框

javascript - 如何制作可缩放的粘性页脚

javascript - 如何使 HTML 元素在悬停时扩展并覆盖同一 flex 容器中的相似相邻元素而不移动它们?

jquery - 创建自定义搜索栏时单击外部 div 更改内部 div 的宽度

php - 在 Lightbox 上定位关闭按钮

jquery - 如何修复 laravel/blade/jQuery/Bootstrap 项目中包括 autoNumeric 的错误?

javascript - 如何将 'rel' 参数更改为 Photoset-grid?

javascript - 在 CKEDitor 中最大化/调整对话框窗口的大小

html - 如何阻止 Webpack-3 的 PurifyCSSPlugin 清理太多?

javascript - 调用 jQuery Extend 中的另一个方法