<分区>
<分区>
请检查以下代码。第一种样式完美应用，但“常规 1”的第二种样式不适用。我必须在“常规”类的第一个元素上应用蓝色。
.plan-list .basic:first-child {
background: red;
}
.plan-list .regular:first-child {
background: blue;
}<ul class="plan-list">
<li class="plan basic">basic 1</li>
<li class="plan regular">regular 1</li>
<li class="plan regular">regular 2</li>
<li class="plan basic">basic 2</li>
</ul>最佳答案
应该是
<style>
.plan-list .basic:first-child {
background: red;
}
.plan-list .regular:nth-child(2) {
background: blue;
}
</style>
<ul class="plan-list">
<li class="plan basic">basic 1</li>
<li class="plan regular">regular 1</li>
<li class="plan regular">regular 2</li>
<li class="plan basic">basic 2</li>
</ul>
这是因为，虽然这个 li 是那个类(class)的第一个 child ， 它实际上是其父项中的第二个子项
关于html - 无论 sibling 之间的位置如何，我如何选择具有特定类的第一个元素？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/57077133/