CSS3 :nth-last-of-type()Селекторы

Пример

Задаёт цвет фона для каждого элемента p, который соответствует предпоследнему соседнему элементу того же типа:

p:nth-last-of-type(2)
{
background:#ff0000;
}

:nth-last-of-type(n) селектор соответствует n-му с конца соседнему элементу того же типа.

nЭто может быть число, ключевое слово или формула.

Совет:См.::nth-last-child()селектор. Этот селектор соответствует n-му с конца структурному дочернему элементу внутри родительского элемента.

Числа в таблице указывают первую версию браузера, которая поддерживает это свойство.

Селекторы
:nth-last-of-type()	4.0	9.0	3.5	3.2	9.6

Слова odd и even можно использовать как ключевые слова для сопоставления дочерних элементов, индекс которых нечётный или чётный.

Здесь мы задаём два разных цвета фона для нечётных и чётных p-элементов nth-last:

p:nth-last-of-type(odd)
{
background:#ff0000;
}
p:nth-last-of-type(even)
{
background:#0000ff;
}

Использование формулы (an + b). Описание: a обозначает размер цикла, n — счётчик (начиная с 0), а b — смещение.

Здесь мы задаём цвет фона для всех элементов p, индекс которых в обратном порядке кратен 3:

p:nth-last-of-type(3n+0)
{
background:#ff0000;
}

Другие расширения