Pseudo-classes and Pseudo-elements
Pseudo-classes and pseudo-elements are special "classes" and "elements" that
are automatically recognized by CSS-supporting browsers. Pseudo-classes distinguish
among different element types ( e.g. , visited links and active links
represent two types of anchors). Pseudo-elements refer to sub-parts of elements,
such as the first letter of a paragraph.
Rules with pseudo-classes or pseudo-elements take the form
| selector:pseudo-class { property: value } |
or
| selector:pseudo-element { property: value } |
Pseudo-classes and pseudo-elements should not be specified with HTML's CLASS attribute. Normal classes may be used with pseudo-classes and pseudo-elements as follows:
| selector.class:pseudo-class { property: value } |
or
| selector.class:pseudo-element { property: value } |
Anchor Pseudo-classes
Pseudo-classes can be assigned to the A element to display
links, visited links and active links differently. The anchor element can give
the pseudo-classes link , visited or active .
A visited link could be defined to render in a different color and even a different
font size and style.
An interesting effect could be to have a currently selected (or "active") link display in a slightly larger font size with a different color. Then, when the page is re-selected the visited link could display in a smaller font size with a different color. The sample style sheet might look like this:
| A:link { color: red } A:active { color: blue; font-size: 125% } A:visited { color: green; font-size: 85% } |
