HTML and CSS Reference
In-Depth Information
Example 3.2: The
first-child
pseudo-class
(continued)
<li><a href="home.html">
Home
</a></li>
<li><a href="about.html">
About
</a></li>
<li><a href="contact.html">
Contact Us
</a></li>
</ul>
</body>
</html>
Figure 3.2: A horizontal menu styled with the
first-child
pseudo-class
CSS3 greatly expanded the list of pseudo-classes with additional structural
classes that, like :
first-child
, permit the selection of any element based on its
relationships to other elements in the DOM. hese include the following:
:root
he root of the document
:nth-child(n)
An element that is the
n
th child of its parent
:nth-last-child(n)
An element that is the
n
th child of its parent,
counting from the last one
:nth-of-type(n)
An element that is the
n
th sibling of its type
:nth-last-of-type(n)
An element that is the
n
th sibling of its type,
counting from the last one
An element that is the irst child of its parent
:first-child
An element that is the last child of its parent
:last-child
An element that is the irst sibling of its type
:first-of-type
An element that is the last sibling of its type
:last-of-type
