CSS3 :nth-last-child()Selectors

Example

Specify the background color for each p element that is the penultimate sibling among elements of the same type:

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

The :nth-last-child(n) selector matches every element that is the Nth child of its element, regardless of type, counting from the last child.

nIt can be a number, a keyword, or a formula.

Tip:See also :nth-last-of-type()Selector. This selector matches the nth-from-last structural child element within the parent element.

The numbers in the table indicate the first browser version number that supports the property.

Selectors
:nth-last-child()	4.0	9.0	3.5	3.2	9.6

Odd and even are keywords that can be used to match child elements whose index is odd or even.

Here, we specify two different background colors for the odd and even p elements in reverse order:

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

Using a formula (an + b). Description: a represents the size of a cycle, n is a counter (starting from 0), and b is an offset.

Here, we specify a background color for all p elements whose index, in reverse order, is a multiple of 3:

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

other extensions