WestCiv CSS Guide

dynamic pseudo class selectors

Explanation

CSS2 extends pseudo class selectors to elements other than links. Dynamic pseudo class selectors apply to any element in the active, hover and focus states.

Syntax

The form of the dynamic pseudo class selector is simply to add one of the following states to an existing selector. The possible states are

For example, to change the background color of a paragraph when the mouse is over it, you use the selector p:hover. Complex selectors can be used in conjunction with the dynamic pseudo class selector. For example, to change the background color of only paragraphs of class "introduction" while they are being clicked, use the selector p.introduction:active.

Use

The dynamic pseudo class selector extends the existing link pseudo class selectors. Now you can make any element on the page have these particular dynamic behaviors. We don't really need to explain too much the power of feedback for the user, but one of the more obvious examples might be their use in forms or types of web page that have user interaction.

Browser support

Internet Explorer Netscape Navigator Opera WebTV
Windows Macintosh (All Platforms) (All Platforms)  
4.0 5.0 5.5 6.0 4.0 4.5 5.0 4.x 6.0 3.5 5.0 1.0
N N N N N N P N Y N N N
No browsers correctly support the value of hover for any elements other than links.
Netscape Navigator 6 almost gets it all right., It has a minor bug when you use a value of hover (for elements other than links): the hover state doesn't actually work when you hover over the text itself, only when you are over the rest of the line that contains the text. As a result of this the hover state doesn't work at all for inline elements.
Internet Explorer 5.0 Macintosh only supports the value of focus.

next: language pseudo class selectors