基于元素索引的nth-child

Question

我想使用css3 nth-child来选择基于索引的匹配元素，而不是基于父元素的整个文档（如jquery：eq（）selector）。

<div id="container"> 
    <div class="result"> 
     <div class="active">content 1</div> 
    </div> 

    <div class="result"> 
     <div class="active">content 2</div> 
    </div> 

    <div class="result"> 
     <div class="active">content 2</div> 
    </div> 
</div> 

这个CSS代码选择所有元素，因为每一个。主动的第一个孩子各自对。结果

.active:nth-child(1) { 
    background: red; 
} 

我想也使身体父

body > .active:nth-child(1) { 
    background: red; 
} 

但父它无法完成这项工作。

我想第n个孩子（1）选择内容1 和第n个孩子（2）选择内容2

Answer 1

我想你想使用第n个孩子上.result。

#container .result:nth-child(1) .active { 
    background: red; 
} 

JSBin