HTML and CSS Reference
In-Depth Information
Changing the color of the elixir headings
Now that you know about descendant selectors, let's set the
<h2>
heading to
black and the
<h3>
headings to red in the elixirs. Here's how you do that:
#elixirs h2 {
color: black;
}
Here, we're using the
descendant
selectors to target
just the <h2>
and <h3> elements in
the elixirs <div>.
We're setting <h2>
to black, and <h3>
to a red color, using
a hex code.
#elixirs h3 {
color: #d12c47;
}
A quick test drive…
Go ahead and add these new properties to the bottom of your
“lounge.css” file, save, and reload “lounge.html”.
We've got
black and red headings
in the eli
xirs section, and we
haven't a
ffected the aquamarine
color bein
g used for <h2>
headings
in the main page.
