appendix A Selectors reference
Selectors target specific elements on the page for styling. CSS provides a wide array of selector types.
A.1 Basic selectors
-
tagname—Type selector or tag selector. This selector matches the tag name of the elements to target. It has a specificity of 0,0,1. Examples:p;h1;strong. -
.class—Class selector. This targets elements that have the specified class name as part of their class attribute. It has a specificity of 0,1,0. Examples:.media;.nav-menu. -
#id—ID selector. This targets the element with the specified ID attribute. It has a specificity of 1,0,0. Example:#sidebar. -
*—Universal selector. This targets all elements. It has a specificity of 0,0,0.
A.2 Combinators
Combinators join multiple simple selectors into one complex selector. In the selector .nav-menu li, for example, the space between the two simple selectors is known as a descendant combinator. It indicates the targeted <li> is a descendant of an element that has the nav-menu class. This is the most common combinator, but there are a few others, each of which indicates a particular relationship between the elements indicated: