This is a surprisingly common question, so wrote about descendants. (I also linked this from the reading.)
<ul> <li>harry</li> <li>ron</li> <li>hermione</li> <li>malfoy, who is a <em>pureblood</em></li> </ul>I'm not sure why <em> is not a child but a descendent."
EM is a grandchild of UL, but not a child. So, EM is a descendant of UL, not a child.
descendant selectors can be useful when you want, say, to style all the hyperlinks in a NAV region, but not worry about whether they are direct children of NAV (they probably aren't).
NAV A { text-decoration: none; color: black }
Or you want to style all the P elements in particular SECTION:
.pullout P { margin: 1em }
We learned four fancy compound selectors:
A BVery common and useful.
A > BLess common, but useful. Say you want to style top-level links differently from submenu links.
A + BThis is often used in lists, where you want everything but the first element to have a style rule, like space between.
A ~ BRelatively rare. Every later sibling after something.
Each property either is inherited or not. Usually pretty intuitive, but you can always look it up if you're unsure. If it's inherited, it can be overridden.
Would you guess that, say, font-size is inherited? Let's see: font-size
Sure. I like using next sibling when adding lines or space between elements, say in a list.
I rarely use the general sibling rule.
These allow us to style things differently based on its state. Visited links versus unvisited links. Hover.
Sure. Here's the question and answers:
To select every list item (LI) except the first (that is, every LI that is immediately preceded by another LI) you would use A. LI LI B. LI + LI C. LI - LI D. LI > LIA and D are descendant relationships. C isn't an option. So, it's B.
Great question. It's important to try to think structurally and systematically. So, don't decide how you want this element to look and then copy/paste that decision to the next element and the next and the next.
Instead, step back and say: Ah, I want elements in this context to have a particular appearance. That context is often an ancestor (or you can create an ancestor to supply the context).
Glad to hear it!