for the past decade are really buried in Media Player now. It took me quite a
while to locate the Help menu, which I thought was a bit inconsiderate: It’s a
little like hiding the fire extinguisher. Media Player 10 is an excellent piece of
software, and its visual design is, to me, quite elegant. For example, when you
hover the mouse pointer over the tabs at the top left, the tabs light up subtly,
like wall sconces in an Art Deco theater. But... that is where the menus
should be.
Figuring Out Dubious Descendant Selectors ...........................................
A set of what are to me dubious “descendant selectors” are coming down
from the CSS gurus in CSS3. Some of these selectors may be more confusing
than useful, but if you’re really into CSS esoterica, grouped patterns could be
just the treat you’ve been looking for.
Descendant selectors specify that a rule applies only to particular children
or descendants, such as only the fourth list item in an unnumbered list. You
can also use it to apply rules to patterns, such as to every third, or every
other, child.
The:only-childselector selects only those elements with, you guessed it,
no siblings (such as a single paragraph within a <div>). A related selector is
the only-of-typeselector, which selects a specific type of element, like an
H1 that has no H1 siblings, but doeshave other siblings, such as a group of
<p>paragraphs. Think of a <div>containing four paragraphs but only one
headline.
Another descendant selector is called the nth-child. To specify a style for only
a particular child, say the sixth item in a list, just use the number itself. This
is not a repeating pattern. This code sets the background color of one child,
the sixth item, to red:
ul:nth-child(6){background-color: red;}
What if you want to use a patternof styles, such as coloring every other table
item’s background light blue? This is a fairly common way to help the reader
distinguish between the various cells, rows, and columns of a table.
Using the nth-child feature, you can specify groupsof children, thereby creat-
ing a pattern. Imagine a list. Inside the <ul> </ul>parent element inside are
a bunch of child lielements, right? What if you want to color every other
child red in your list? You can use the nth-child pseudo-class to create the
effect:
Chapter 15: CSS Moves into the Future 277
