Html 下课后选择第n个子项

因此，我有一个ul元素列表，我想选择.active类之后的前3个li元素

<ul>
 <li>The #1</li>
 <li>The #2</li>
 <li class="active">The #3</li>
 <li>The #4</li>
 <li>The #5</li>
</ul>

但它不起作用。有人能帮我吗

---

注意：Class.active是动态变化的，因此任何ul li:n子级（n+3）都不会有帮助。

根据标记和层次结构的工作方式，使用选择器上的

n

选项似乎无法做到这一点

如果您希望为

li.active

选择器后面的三个

li

选择器提供红色背景，您可以通过一次调用在css中添加

+li

来确定它们的目标，方法是根据需要添加多次，将选择器分组在一起，如下所示：

li.active+li，
li.active+li+li，
li.active+li+li+li{
颜色：红色；
}

#1
#2

#4
#5

根据标记和层次结构的工作方式，使用选择器上的

n

选项似乎无法执行此操作

如果您希望为

li.active

选择器后面的三个

li

选择器提供红色背景，您可以通过一次调用在css中添加

+li

来确定它们的目标，方法是根据需要添加多次，将选择器分组在一起，如下所示：

li.active+li，
li.active+li+li，
li.active+li+li+li{
颜色：红色；
}

#1
#2

#4
#5

这与+选择无关，因此更具体。。。你最初说的是一个元素。顺便说一下，你可以用+。。。只需将它们追加3次是的，很抱歉。我更新了Questionn选择器标准，该标准依赖于层次结构，并将标记名的级别降低。不能通过类将兄弟姐妹作为目标。使用相邻兄弟组合符有什么问题：+？它必须是激活后的前3个？激活后不是全部？这与+选择无关，因此更具体。。。你最初说的是一个元素。顺便说一下，你可以用+。。。只需将它们追加3次是的，很抱歉。我更新了Questionn选择器标准，该标准依赖于层次结构，并将标记名的级别降低。不能通过类将兄弟姐妹作为目标。使用相邻兄弟组合符有什么问题：+？它必须是激活后的前3个？激活后不完全激活？这对我没有帮助，对不起：/你能解释一下原因吗？你说你要把三个李的“选”出来，在李活跃的班级之后。这就实现了这一点。你能解释一下为什么这没用吗？@zagzter这是唯一的办法，如果你不喜欢它，你就做不到it@zagzter，人们解释了为什么使用

nth

不适用于此层次结构。这真的是你最好的解决方案。我不相信有其他方法可以做到这一点，除非您使用JavaScript或更改标记。这样做有什么不对？请告诉我这对你没有帮助的原因。隐瞒信息对你没有帮助。@zagzter你找到解决办法了吗？这对我没有帮助，对不起：/你能解释一下原因吗？你说你要把三个李的“选”出来，在李活跃的班级之后。这就实现了这一点。你能解释一下为什么这没用吗？@zagzter这是唯一的办法，如果你不喜欢它，你就做不到it@zagzter，人们解释了为什么使用

nth

不适用于此层次结构。这真的是你最好的解决方案。我不相信有其他方法可以做到这一点，除非您使用JavaScript或更改标记。这样做有什么不对？请告诉我这对你没有帮助的原因。隐瞒信息对你没有帮助。@zagzter你找到解决办法了吗？

ul li.active ~ li:nth-child(n+3)