如何在CSS中选择子项

Question

这是我的CSS片段：

div.orgChart  div.node.level2 {
    background-image      : linear-gradient(to bottom, #FFFFFF, #00C)!important;
}

现在我需要为3级及以下的所有孩子添加另一条规则：

div.orgChart div.node.level3，div.orgChart div.node.level4，div.orgChart div.node.level5 etc

我该怎么做？

由于

Answer 1

您无法使用css3选择此项。

我会采用另一种方式：首先选择所有节点，然后覆盖level2：

div.orgChart  div.node {
    background-image: Something here that should be used for all these non level2 nodes;
}

div.orgChart  div.node.level2 {
    background-image: linear-gradient(to bottom, #FFFFFF, #00C)!important;
}

由于特异性level2将获得第二个定义而不是第一个定义。一定要覆盖第一个定义中定义的所有内容。