creating & modifying css style rules
continued
Applying style to Links (hyperlinks)
Links are styled like any other element, but can be made to display differently in the browser according to their state (whether they have been visited, are hovered over, etc.).
The order in which link properties are defined is important, because a link can be in more than one state simultaneously. For example, both visited and hovered over. The order given below is recommended, though only the first two are necessary (it helps visitors to know whether they've already visited a page).
The examples below use a grey scale, but yoiu don't need to!
link - page not yet visited
a:link {color: #222222;}
visited - page has been visited
a:visited {color: #444444;}
focus - page selected via the keyboard
a:focus {color: #666666;}
hover - the link is pointed to with the mouse
This is more reliable than using javascript 'mouseover', because many internet users now have javascript disabled.
a:hover {color: #888888;}
active - the link has been clicked
a:active {color: #aaaaaa;}
Example - to change both font and background when the mouse points at the link
a:hover {color: #992222;
background-color: #229999;}
This gives an effect like this. Choose you own colour scheme!
Selecting only part of an element
My favourite!
p: first-letter {font-size: 120%;}
first-line and first-letter are the only options that have widespread browser support at present (January 2006). The first letter could be a different font, different font-weight (boldness), etc.
Selecting groups of element at once
If several elements share common properties, they can be all defined in the same rule.
Example
h3, h6 {color: #882222;}
Combining Selectors
A coda, for the obsessive coder:-
div.limericks p it:first-letter {color: #446688;}
Personally, I think if you're going to be that choosy about whether or not to do something, you could more easily take a leaf out of the trainee bimbo's handbook:-