css - 使用 CSS 的交替行颜色在另一个内部不起作用

Question

这是为什么？两个 block 引用都是蓝色的。 TR 的颜色会交替出现，但 block 引号不会。怎么会？

<tr>
    <blockquote>Hello</blockquote>
</tr>

<tr>
    <blockquote>Hello</blockquote>
</tr>



tr:nth-child(even){ background-color: #272727; }
tr:nth-child(odd) { background-color: #222222; }

blockquote:nth-child(even){ background-color: red; }
blockquote:nth-child(odd) { background-color: blue; }

Answer 1

改用nth-of-type:

tr:nth-of-type(even) {
    background-color: #272727;
}
tr:nth-of-type(odd) {
    background-color: #222222;
}
tr:nth-of-type(even) blockquote {
    background-color: red;
}
tr:nth-of-type(odd) blockquote {
    background-color: blue;
}

jsFiddle example (为了可见性改变了颜色)