► Думаю, все знают про :nth-child, :nth-last-child. А также про :nth-of-type и :nth-last-of-type.

#фишка дня

Думаю, все знают про :nth-child, :nth-last-child. А также про :nth-of-type и :nth-last-of-type.

Что в них самое раздражающее?

Кто сказал нумерация с единицы? Иди в свой Си.

Конечно же это неочевидность, а когда-то и невозможность, выбора элементов по классу или иному атрибуту!

Да-да, :nth-of-type выбирает по тегу, даже не по классу. Так что же делать?

А делать вот что: уже пару лет с нами присутствует синтаксис-дополнение к nth-child. И называется он of S.

Выглядит так:

:nth-child(An+B [of S]?)

:nth-last-child(An+B [of S]?)

А применяется так:

:nth-child(2 of .highlight)

:nth-child(even of :not([hidden]))

Первый выберет второе появление элемента с классом .highlight, а второй — все чётные не скрытые элементы.

#css #nth #selector