MDN’s new design is in Beta! A sneak peek: https://blog.mozilla.org/opendesign/mdns-new-design-beta/

:nth-of-type

Описание

CSS псевдокласс :nth-of-type(an+b) находит элемент элемент, имеющий an+b-1 потомков с тем же тегом до него в дереве документа, с положительным или нулевым значением для n, и имеющий родительский элемент. Смотрите :nth-child для более детального описания его аргументов. Это более гибкий и полезный псевдоселектор, если вы хотите убедиться, что вы выбираете тот же тег, неважно, где он, в родительском элементе или других различных тегах до него.

Синтаксис

element:nth-of-type(an + b) {стили }

Пример

Этот пример осуществляет выравнивание параграфов то слева, то справа.

CSS

p:nth-of-type(2n+1) { text-align: left; }
p:nth-of-type(2n) { text-align: right; }

HTML

<div>
    <p>Первый параграф (выравнивание слева)</p>
    <p>Второй параграф (выравнивание справа)</p>
    <p>Третий параграф (выравнивание слева)</p>
</div>

Спецификации

Спецификация Статус Комментарий
Selectors Level 4
Определение ':nth-of-type' в этой спецификации.
Рабочий черновик Без изменений
Selectors Level 3
Определение ':nth-of-type' в этой спецификации.
Рекомендация Изначальное определение

Поддержка браузерами

Возможность Chrome Firefox (Gecko) Internet Explorer Opera Safari
Базовая поддержка 1.0 3.5 (1.9.1) 9.0 9.5 3.1
Возможность Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Базовая поддержка 2.1 1.0 (1.9.1) 9.0 9.5 3.1

Смотрите также

Метки документа и участники

Метки: 
 Внесли вклад в эту страницу: BychekRU
 Обновлялась последний раз: BychekRU,