具有mod(或模)运算符的第n个子项

问题描述 投票:17回答:4

是否可以将nth-child与模数一起使用?我知道您可以指定一个公式,例如

nth-child(4n+2)

但是我似乎无法找到是否有模运算符。我在下面尝试了以下示例,但似乎都没有用:

nth-child(n%7)
nth-child(n % 7)
nth-child(n mod 7)
css css3 css-selectors modulo
4个回答
21
投票

否,:nth-child()仅支持加,减和:nth-child()

[我搜集到您正在尝试获取前6个元素(因为任何正整数coefficient multiplicationn mod 7仅给您n0)。为此,您可以改用以下公式:

6

否定:nth-child(-n+6) ,元素计数从零开始向后进行,因此将选择这些元素:

n

0 + 6 = 6 -1 + 6 = 5 -2 + 6 = 4 -3 + 6 = 3 -4 + 6 = 2 -5 + 6 = 1 ...


26
投票

如果要对jsFiddle demo取模nth-child,只需指定:

k

例如,如果要为3、6、9,..元素指定样式,只需指定(nth-child(kn) = 3),然后使用:

k

您也可以指定偏移量:

nth-child(3n)

9
投票

我知道这个话题很老了,但是下面的答案已经足够模运算符了:

nth-child(kn+offset)

这将选择元素1-6、8-13等...

:not(:nth-child(7n))

上面的代码将选择可被“ a”整除的元素,因此添加:not()选择器将强制CSS选择不可被“ a”整除的元素。

我希望有人觉得它有用;)


0
投票

我知道这个话题很老,但是答案是:

:nth-child(an)

此选择器的目标是所有在第n个子公式所表示的最后一组完整子集中的最后一个子之后的所有子。

© www.soinside.com 2019 - 2024. All rights reserved.