已排序cols的CSS未应用于斑马条纹数据表中

Question

请点击此处：http://jsfiddle.net/7QtSS/

当使用Firefox的检查器检查哪些样式应用于第一个单元格（左上角，标题下方）时，它使用来自demo_tables [368]的tr.odd td.sorting_1样式，该样式被`tr的样式覆盖。奇数td.dc1'在内联[23]。

我期待内联[8]的​​tr.odd td.dc1 td.sorting_1更具体的风格会被应用，但事实并非如此 - 即使改变了这些风格的顺序（如同这个小提琴：http://jsfiddle.net/7rezt/1/ ） - 那么我的错在哪里，如何为排序的列分配不同的颜色？

Answer 1

您的问题是不正确的CSS语法。 tr.odd td.dc1 td.sorting_1意味着

为background-color设置sorting_1，sorting_1是dc1的孩子而dc1是odd的孩子。

当他们是td.dc1的孩子时，您可能希望将td.sorting_1 和 background-color: #e55c5c;设置为tr.odd：

tr.odd td.dc1, tr.odd td.sorting_1 {
  background-color: #e55c5c;
}

---

整个CSS：

tr.odd td.dc1, tr.odd td.sorting_1 {
  background-color: #e55c5c;
}
tr.even td.dc1, tr.even td.sorting_1 {
    background-color: #f05b5b;
}
tr.odd td.dc1 {
    background-color: #e86e6e;
}
tr.even td.dc1 {
    background-color: #f37878;
}
tr.odd td.dc1, tr.odd td.sorting_1 {
    background-color: #e55c5c;
}
tr.even td.dc1, tr.even td.sorting_1 {
    background-color: #f05b5b;
}

分叉小提琴 - ＆gt;的 http://jsfiddle.net/H95TC/

Answer 2

要根据多个类进行选择，需要在彼此之后直接编写 - 没有空格。所以它应该是：

tr.odd td.dc1.sorting_1 { blabla }

等...