HTML and CSS Reference
In-Depth Information
It has a header, an article, and a footer, but note that the
<article>
ele-
ment also has its own footer. This lets you see the difference between
the descendant and child combinators.
DescendAnt
combinator
body footer {
background-color: #000;
}
Selects every footer
which is a descendant
of body
>
The child
combinator
>
body > footer{
background-color: #000;
}
Selects only direct
children of body
The child combinator is useful when you have nesting and the same
element appears multiple times at different depths: for example, a menu
made up from unordered lists where each item is itself an unordered
list. With the child combinator, it's easy to apply different styles to the
top-level and lower-level items.
Cascading and specificity
The
cascading
part of Cascading Style Sheets refers to the rules that
determine which of a set of competing rules apply to an element. This is
important because multiple rules can have a definition that applies to
the same property of the same element.
