Chapter 14
Chapter 14: Specializing in Selection ..........................................................................
In This Chapter
Working with tree structures
Distinguishing parenthood from ancestry
Inheriting through offspring
Handling contextual selectors
W
hen styles cascade, their effects bump down to lower levels like snow
falling down a tree. Unless you specify otherwise, a style cascades
down through your document and is applied wherever its targets (the selec-
tors) are located. It’s also applied to any descendant elements — elements
embedded within the target, such as an italics element embedded within a
paragraph.Is there a way to apply styles to an element only if it’s embedded within a
particular element, rather than universally? In other words, can you ask for
example that italics within headlines be boldface, but not when they’re within
paragraphs? You bet. Selectors can be designed so they’re highly specific.
But before looking at special kinds of selectors, it helps to first have a good
grasp of how a browser moves down through the structure of a document,
deciding how and when to apply CSS styles.To get a real understanding of selecting, inheritance, specificity, and the
cascade, you have to understand the concept of the tree structure that
describes the design of a Web page. In this chapter, you see how a tree
structure works and also how to use specialized selectors.Getting Specific with Inheritance ..............................................................
I introduced the concept of specificity in Chapter 2. Specificitymeans that if
two styles conflict, the style “nearest” the element wins. Say that a <p>style
is defined in an external (.css file) style sheet as italic, but <p>is defined as
normal, non-italic in a document’s “embedded” style (inside the <head>
</head>tags). The embedded style is located closer to the <p>elements
in the document, so it wins: It’s the style that gets applied.