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