Справочник по CSS : Тематический указатель : Селекторы : Псевдоклассы : :nth-of-type
смотрим также
Материал из Справочник Web-языков
Содержание |
Псевдокласс :nth-of-type
Аналогично :nth-child. Действует лишь на потомков, которые соответствуют элементу в селекторе (имеют тот же тип).
Синтаксис
element:nth-of-type(an + b) { style properties }
Замечания
Значения a и b являются числовыми.
Использование псевдокласса :nth-of-type полезно, если вы хотите, например, выделить элементы одного типа, которые внутри себя могут содержать элементы других типов. Это могут быть абзацы текста, внутри которых могут быть различные рисунки или таблицы; но стиль надо применить именно к определенным абзацам.
Примеры
В примере с помощью псевдокласса :nth-of-type один стиль применяется для нечетных по счету картинок в тексте, а второй для четных.
img:nth-of-type(2n+1) { float: right; } img:nth-of-type(2n) { float: left; }
Стандарты
Этот псевдоэлемент определен в CSS 3 Selectors
Поддерживаемые браузеры
Firefox (Gecko) начиная с версии 3.5 (1.9.1)
Opera начиная с версии 9.5
Safari (WebKit) начиная с версии 1.1 (100)