<style>
h1{color: red;}
</style>
This rule means that throughout the HTML code, every H1 element gets
selected to have the color red applied to it. Selectors tell CSS what HTML
elements to target for the application of the CSS rule.
But there’s more to selectors than you might have suspected. Consider some
of the additional ways you can use selectors. They’re more versatile than you
might suppose.
Working with Universal Selectors ...............................................................
You might wonder if you can affect everything in a Web site — not just certain
tags, but all tags? You bet. You can use a *to create a universal selector that
has a global effect. Perhaps one day your boss comes in — your boss who has
absolutely no taste or sense of design — and says: “Look. I think we should
make our Web site stand out from the crowd, so let’s make the whole thing
boldface! How about that?”
“You mean all the headlines?”
“No, I mean everything from the little captions to the text to the biggest head-
lines. Everything! What a great idea.”
“Why stop there?” you ask, failing to remember that sarcasm is usually lost
on your boss. “Why not also make the entire background a bright plaid?”
“Hey, I think you’ve got something there!” he says, and goes back to his office
to think up some other subtle ideas. Well, he is the boss.
To make the whole enchilada boldface without the use of a universal selector,
you’d have to create a group of selectors like this:
body, p, table, h1, h2, h3, h4, h5, h6, {font-weight: bold;}
Actually, you’d have to create an even larger group, grouping most of the tags
in your HTML, such as th, td, pre, strong, em, and any others you’ve used
or might use in the future.
Not to worry. Rather than building an enormous group selector, you can just
use a universal selectorand change the text of your entire Web site to bold to
make the boss happy, like this:
48 Part I: The ABCs of CSS
