css - 如果每个元素都嵌入另一个元素中，我如何才能获得每个第二个元素？

Question

<div class="question_container">
    <div class="views">
        <div>10</div>
    </div>
    <div>Something else</div>
</div>
<div class="question_container">
    <div class="views">
        <div>10</div>
    </div>
    <div>Something else</div>
</div>
<div class="question_container">
    <div class="views">
        <div>10</div>
    </div>
    <div>Something else</div>
</div>

我如何在纯 CSS 中设置每个第二类 View 的样式。

在jquery中我会做

$('*[class=views]:even').addClass('views');

但是我该如何做这个 CSS？

Answer 1

您可以为此使用 :nth-child 属性:

例子:

.question_container:nth-child(2n) .views{
    color: red;
}

:nth-child(2) 将选择仅 第二项，而 :nth-child(2n) 将选择 每第二个元素。