CSS选择接下来的两个元素

Question

我有以下HTML:

...
<li>...</li>
<li>...</li>
<li class="last">...</li>

<li class="selected">...</li>  # <- this
<li>...</li>                   # <- this
<li class="last">...</li>      # <- this

<li>...</li>
<li>...</li>
<li class="last">...</li>
....

所以,基本上是三个lis的组,最后一个具有特定类,并且在其中一个组中,第一个li具有特殊类.

有没有办法用纯CSS来选择li带有selected类和接下来的两个,在上面的代码中标记？

我已经设法选择了下一个使用li.selected + li,但这对那之后的那个不起作用.

Answer 1

只需添加另一个+ li即可到达:

li.selected, li.selected + li, li.selected + li + li