css - 如何在 CSS 中继承祖先而不是父级？

Question

这是我的代码:

.ancestor { 
    background-color: #ccc;
}

.parent { 
    background-color: #fff;
}

.child {
    /* ??? */
}

我怎样才能拥有 .child继承 background-color: #ccc; 没有 更改类声明顺序？

我试过 background-color: inherit;但我得到的只是 background-color 的完全重置(即没有颜色)属性(property)。

另请注意，我无法更改 .ancestor也不是 .parent .

Answer 1

你可以这样做:

.ancestor { 
    background-color: #ccc;
}

.parent { 
    background-color: #fff;
}

.child {
    background-color: #ccc;
}

或者你可以这样做:

.ancestor { 
    background-color: #ccc;
}

.parent { 
    background-color: #fff;
}

.child {
    /* ??? */
}

并且有

html div 或类似的东西:

<div class="ancestor child"></div>