СSS Селектор :nth-last-of-type()
Пример
Указать цвет фона для каждого элемента <p>, который является вторым элементом p его родителя, считая от последнего дочернего элемента:
p:nth-last-of-type(2)
{
background: red;
}
Редактор кода »
Определение и использование
Селектор :nth-last-of-type (n) соответствует каждому элементу, который является n - м дочерним элементом определенного типа его родителя, считая от последнего дочернего элемента.
n может быть число, ключевое слово или формула.
Совет: Посмотрите на селектор :nth-last-child() для выбора элемента, который являетсяn - м дочерним элементом, независимо от типа, его родителя, считая от последнего дочернего элемента.
Версия: | CSS3 |
---|
Поддержка браузеров
Числа в таблице указывают первую версию браузера, которая полностью поддерживает селектор.
Селектор | |||||
---|---|---|---|---|---|
:nth-last-of-type() | 4.0 | 9.0 | 3.5 | 3.2 | 9.6 |
CSS Синтаксис
Примеры
Пример
Нечетные и четные - ключевые слова, которые можно использовать для сопоставления дочерних элементов, индекс которых нечетен или четен (индекс первого дочернего элемента равен 1).
Здесь мы указываем два разных цвета фона для нечетных и четных элементов p:
p:nth-last-of-type(odd)
{
background: red;
}
p:nth-last-of-type(even)
{
background: blue;
}
Редактор кода »
Пример
Используя формулу (an + b). Описание: a представляет размер цикла, n - счетчик (начинается с 0), и b - смещение значения.
Здесь мы указываем цвет фона для всех элементов p, индекс которых кратен 3:
p:nth-last-of-type(3n+0)
{
background: red;
}
Редактор кода »