html - css 类的第 n 个子节点(偶数)不是所有节点

Question

尝试只为类 'story' 的某些其他 div 着色:

<div class="wrap-well">
    <div class="story">odd</div>
    <div class="story">even</div>
    <div class="clearfix"></div>
    <div class="story">odd</div>
    <div class="story">even</div>
    <div class="clearfix"></div>
    <div class="story">odd</div>
    <div class="story">even</div>
</div>

CSS:

.wrap-well div.story:nth-child(even) {
    background-color:#ff00ff;
}

fiddle : http://jsfiddle.net/NF2dk/

但似乎 'clearfix' 列也被计算在内......

Answer 1

@Marcin 和@Explosion Pills 在这里绝对正确，但当我检查你的 DOM 时，你有一个一致的模式，你可以使用相邻选择器来实现这一点，而不是使用 nth-child 或 nth-of-type

.wrap-well div.story + div.story {
    background-color:#ff00ff;
}

Demo

这样，它就会完成你想要实现的工作，而且与 nth 伪类相比，它的兼容性要好得多