# Псевдокласс nth-last-of-type

Псевдокласс `nth-last-of-type` выбирает элемент, который является n-ным потомком родителя заданного типа, отсчитывая с конца. Ведет себя аналогично `nth-of-type`, только отсчет ведется с конца.

## Синтаксис

`селектор:nth-last-of-type(число | odd | even | выражение) { }`

## Значения

Значение | Описание
--- | ---
число | Положительное число начиная с `1`. Задает номер элемента, к которому мы хотим обратиться. Нумерация элементов начинается с `1`.
`odd` | Нечетные элементы.
`even` | Четные элементы.
выражение | Можно составлять специальные выражения с буквой n, которая обозначает все целые числа от нуля (не от единицы) до бесконечности. Так, `2n` - значит все четные числа (начиная со второго). Как это понять? Подставляем в `n` последовательно числа от `0` и так далее: если n = 0, то 2n даст 0 - такого элемента нет (нумерация элементов с 1), если n = 1, то 2n даст 2 - второй элемент, если n = 2, 2n дает 4 - четвертый элемент. Если написать 3n - это будет каждый третий элемент (начиная с третьего), и так далее.

## Пример

Найдем `h2`, который является `2`-ым `h2` в родителе с конца:

`<div> <h2>заголовок</h2> <p>абзац</p> <h2>заголовок</h2> <p>абзац</p> <h2>заголовок</h2> <p>абзац</p> <h2>заголовок</h2> <p>абзац</p> <h2>заголовок</h2> <p>абзац</p> <h2>заголовок</h2> <p>абзац</p> <h2>заголовок</h2> <p>абзац</p> </div>` `h2:nth-last-of-type(2) { color: red; }`

:

## Пример

Найдем все четные h2 с конца:

`<div> <h2>заголовок</h2> <p>абзац</p> <h2>заголовок</h2> <p>абзац</p> <h2>заголовок</h2> <p>абзац</p> <h2>заголовок</h2> <p>абзац</p> <h2>заголовок</h2> <p>абзац</p> <h2>заголовок</h2> <p>абзац</p> <h2>заголовок</h2> <p>абзац</p> </div>` `h2:nth-last-of-type(even) { color: red; }`

:

## Пример

Найдем все нечетные h2 с конца:

`<div> <h2>заголовок</h2> <p>абзац</p> <h2>заголовок</h2> <p>абзац</p> <h2>заголовок</h2> <p>абзац</p> <h2>заголовок</h2> <p>абзац</p> <h2>заголовок</h2> <p>абзац</p> <h2>заголовок</h2> <p>абзац</p> <h2>заголовок</h2> <p>абзац</p> </div>` `h2:nth-last-of-type(odd) { color: red; }`

:

← →
↑
en ru