Question

我希望所有5个孩子如果有5个孩子（如果有4个或6个孩子，请不要选择任何孩子。）

举例说明：http://jsfiddle.net/rudiedirkx/339H6/3/show/

如果非常简单，可以选择所有元素：

:first-child:last-child

您可以选择前5个和后5个中的元素：

:nth-child(-n+5):nth-last-child(-n+5)

（演示中的红色）两者都没有做我想要的，但说明了一点：1个选择器，几个元素。

如果有5个选择器，您可以选择所有孩子：

li:nth-child(1):nth-last-child(5),
li:nth-child(2):nth-last-child(4),
li:nth-child(3):nth-last-child(3),
li:nth-child(4):nth-last-child(2),
li:nth-child(5):nth-last-child(1)

（小提琴中的黄色）但这太可怕了。当我决定我也喜欢4时，这是非常可怕的：如果有4个OR 5元素，那么选择它们。这将需要4个选择器。

有没有一个体面的方式来做到这一点，我错过了？我觉得:nth-child(-n+5):nth-last-child(-n+5)正在走上正轨，但选择的方式过于宽泛。（小提琴中的绿色。）

Answer 1

在确定第一个孩子也是最后一个孩子之后，您可以使用普通兄弟组合子来选择其余元素：

li:first-child:nth-last-child(5), 
li:first-child:nth-last-child(5) ~ li

不幸的是，你仍然需要重复选择器至少一次，因为你需要一个匹配第一个孩子，然后另一个与兄弟组合子匹配其余的。但它肯定会再重复四次。

如果恰好有5个，则用CSS选择所有元素

1 个答案: