0

因此，当您使用.class:nth-child(2)它时，它将影响文档中该类的所有第二个实例......我希望它只影响第一个实例。让我解释：

.content:nth-child(2)将影响具有受影响属性的内容

<div class="test">
    <div class="content">a</div>
    <div class="content" affected="true">a</div>
    <div class="content">a</div>
    <div class="content">a</div>
</div>
<div class="test">
    <div class="content">a</div>
    <div class="content" affected="true">a</div>
    <div class="content">a</div>
    <div class="content">a</div>
</div>

提琴手

我的问题是，如何将其设置为仅影响第 n 个子项的第一个实例，就像.content整个文档中的第二个实例一样，而不是.contents任何 div 中的所有第二个实例？

4

2 回答 2

1

你的意思是你只想影响第一个d.test中的第二个div.conent？

.test:first-child .content:nth-child(2){
    background-color:#f00;
}

希望我理解正确。

于 2013-07-12T06:14:43.927 回答
1

您可以将其应用于第二个 div，该 div 必须以独特的方式标识

http://jsfiddle.net/r3bSz/1/

#test >.content:nth-child(2){
 background-color:#f00;
}

有多种方法可以实现这一目标。例如，您也可以选择第一个孩子 (:first-child或:nth-child(1))。

于 2013-07-12T06:13:53.460 回答