nth-child с оператором mod (или по модулю) - PullRequest
16 голосов
/ 25 мая 2011

Можно ли использовать nth-child по модулю? Я знаю, что вы можете указать формулу, например

nth-child(4n+2)

Но я не могу найти, есть ли оператор по модулю. Я попробовал следующие примеры ниже, но ни один из них не работает:

nth-child(n%7)
nth-child(n % 7)
nth-child(n mod 7)

Ответы [ 3 ]

23 голосов
/ 26 мая 2014

Если вы хотите использовать nth-child с модулем k, просто укажите:

nth-child(kn)

Например, если вы хотите указать стиль для 3, 6, 9, .. элементов, просто укажите (k = 3) и используйте:

nth-child(3n)

Вы также можете указать смещение:

nth-child(kn+offset)
20 голосов
/ 25 мая 2011

Нет, :nth-child() поддерживает только сложение, вычитание и умножение коэффициентов .

Я полагаю, вы пытаетесь подобрать первые 6 элементов (какn mod 7 для любого положительного целого числа n дает только от 0 до 6).Для этого вы можете использовать эту формулу вместо:

:nth-child(-n+6)

При отрицании n подсчет элементов выполняется в обратном порядке, начиная с нуля, поэтому будут выбраны следующие элементы:

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

jsFiddle demo

9 голосов
/ 07 июля 2014

Я знаю, что эта тема очень старая, но вот ответ, который достаточно близок к оператору по модулю:

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

Это выберет элементы 1-6, 8-13 и так далее ...

:nth-child(an)

Приведенный выше код будет выбирать элементы, делимые на «a», поэтому добавление: not () selector заставляет CSS выбирать элементы, не делимые на «a».

Я надеюсь, что кто-то найдет это полезным;)

...