<div class="heading-container">
<p class="stroke">Who we</p>
<h2 class="section-title extreme-bold">Contact us</h2>
<p class="stroke"></p>
</div>
现在我可以使用以下选择器选择第一个.stroke:
.heading-container .stroke:nth-child(1){
max-width: 200px;
}
但以下内容不适用于第二个笔划类:
.heading-container .stroke:nth-child(2){
max-width: 200px;
}
但以下内容再次有效:
.heading-container .stroke:nth-child(3){
max-width: 200px;
}
现在为什么价值3适用于第二个第n个孩子的选举?
对于第二个孩子来说,以下是不合适的:
.heading-container .stroke:nth-child(2){
max-width: 200px;
}
答案 0 :(得分:9)
第n个孩子,正如here所解释的那样,基于他们父母的第n个孩子的元素进行选择。
所以1正在工作,因为第一个笔画是第一个孩子。 3是有效的,因为第二个中风是第三个孩子。 2将无效,因为没有第二个孩子的笔画,只有h2