HTML tutorial
CSS3 tutorial
Bootstrap tutorial
JavaScript tutorial
JQuery tutorial
AngularJS tutorial
React tutorial
NodeJS tutorial
PHP tutorial
Python tutorial
Python3 tutorial
Django tutorial
Linux tutorial
Docker tutorial
Ruby tutorial
Java tutorial
C tutorial
C ++ tutorial
Perl tutorial
JSP tutorial
Lua tutorial
Scala tutorial
Go tutorial
ASP.NET tutorial
C # tutorial
Specify a background color for every <p> element that is the second p element of its parent, counting from the last child
The :nth-last-of-type(n)
selector
matches every element that is the nth child, of a particular type, of its
parent, counting from the last child.
Version: | CSS3 |
---|
The numbers in the table specifies the first browser version that fully supports the selector.
Selector | |||||
---|---|---|---|---|---|
:nth-last-of-type() | 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 (the index of the first child is 1).
Here, we specify two different background colors for odd and even p elements:
p:nth-last-of-type(odd)
{
background: red;
}
p:nth-last-of-type(even)
{
background: blue;
}
Using a formula (an + b). Description: a represents a cycle size, n is a counter (starts at 0), and b is an offset value.
Here, we specify a background color for all p elements whose index is a multiple of 3:
p:nth-last-of-type(3n+0)
{
background: red;
}