HTML and CSS Reference
In-Depth Information
a:link, a:visited {
text-decoration: none;
}
You'll remember that we covered different types of CSS selectors in
Chapter 1
, and briefly
touched on the fact that selectors can be combined using a comma. That's what we're doing
in this example, and it's called
selector grouping
.
To help you understand what this accomplishes, take a look at the following code:
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
}
This longhand code would produce the same result as that in the previous code block. You
can easily see why the previous example is the better choice—we avoid repeating the declar-
ation. In a large CSS file, using selector grouping can save you
hundreds
of lines of code.
Now let's discuss exactly what we're doing in that comma-separated selector group. In both
of the group's selectors, we're using the element type selector to target
<a>
elements, and
we're also using a pseudo-class for each.
The
:link
pseudo-class is something you'll see from time to time, but it's rarely, if ever,
necessary. This pseudo-class targets all
<a>
elements that have an
href
attribute set in the
HTML (i.e, they're links). Theoretically, you could have an
<a>
element without an
href
attribute defined, but you'll only occasionally see that nowadays. So, technically, we could
do this instead:
a, a:visited {
text-decoration: none;
}
Or even simply this:
