HTML and CSS Reference
In-Depth Information
nth-last-of-type
The :nth-last-of-type(an + b) pseudo-class matches the element of the selected type
that has an+b elements of that same type after it. This behavior is equivalent to the :nth-
of-type pseudo-class, except that elements are counted starting from the bottom instead
of the top.
p:nth-last-of-type(3) {} /* third last paragraph */
p:nth-last-of-type(-n+2) {} /* last two paragraphs */
These two rules apply to the following example. The <em> element is not counted
because it is not of the specified type—in this case, paragraph.
<div>
<p>Third last</p>
<p>Last two</p>
<p>Last two</p>
<em>Text</em>
</div>
nth-last-child
The :nth-last-child(an + b) pseudo-class represents any element that has an+b
siblings after it. Its behavior is the same as :nth-child , except that it starts with the
bottom element instead of the top one.
p:nth-last-child(3) {} /* third last child */
p:nth-last-child(-n+2) {} /* last two children */
These two rules apply to the child elements in the following example:
<div>
<p>Third last</p>
<p>Last two</p>
<p>Last two</p>
</div>
empty
The :empty pseudo-class matches selected elements that do not have any content.
p:empty {} /* empty paragraphs */
 
Search WWH ::




Custom Search