css - CSS 中是否可以使用替代嵌套样式？

Question

我正在做一个小实验，尝试为嵌套的 div 替换背景颜色。

这是我打算实现的(没有内联样式):

<div style="background: #fff;">
    <div style="background: #000;">
        <div style="background: #fff;">
            <div style="background: #000;">
                and so on...
            </div>
        </div>
    </div>
</div>

我觉得我一定遗漏了一些明显的东西!我尝试了 div:nth-of-type(2n) 但这似乎只适用于一个级别。

这是用于生成 div 的实验，因此解决方案需要无穷无尽(不是类似于 div div div div = white 的东西)。我知道使用 JavaScript 很容易，只需寻找纯 CSS 解决方案。

Answer 1

正如 Lister 先生所指出的，第 nth-of-type 在一个级别(所选 div 的父级别)上工作。

据我所知，在浏览了 W3C CSS3 Selectors 之后似乎没有任何用于遍历嵌套的 css 选择器(> 选择器除外，它只查看父级的直接子级)。

我希望你被证明是错误的，因为这可能非常有用。

所以唯一的 (css) 解决方案就是您已经说过的那个:div > div > div {background: white; 不能在生成 div 的同时生成这个吗？