PSEUDO-CLASSES: hover

hover
 
Compatibility:  IE4+  N6+
Version: Level 2
 
The hover pseudo-class is used to apply a style to a link element when the cursor passes over the link (i.e., a mouse-over). Under those circumstances, the cusor is said to hover over the link.
 
All together, there are four pseudo-classes that are reserved for use with the HTML anchor tag (a). They are used to assign any appropriate CSS property:value pair to a link. Most typically, they are used to designate a font color, or background color, or to remove the under lining.
 
The three other pseudo-classes used with the a tag are:
 
active
The active pseudo-class effects a style when the link is selected (clicked on).
 
link
The link pseudo-class effects a style for a link that is not active and has not been visited.
 
visited
The visited pseudo-class effects the style for a link after the link has been visited.
 
A pseudo-class is assigned to a selector via following syntax:
 
selector:pseudo-class { property: value; ...; }
 
A pseudo-class can also be used with the value assigned as a class to a selector:
 
selector.class:pseudo-class { property: value; ...; }
 
Code:
a:active { background-color: RGB(100, 14, 107); text-decoration: none; }
a:hover { color: red; text-decoration: none; }
a:link { color: teal; text-decoration: none; }
a:visited { visibility: hidden; }

 
or
 
a.example:hover {
color: yellow; font-size: 50px; background-color: red; text-decoration: none;
}
 
<a class="example" href="http://www.devguru.com" target="_blank">DevGuru</a>

 
Move the mouse over the following link and note the appearance change:
 
Output:
DevGuru


Copyright 1999-2001 by Infinite Software Solutions, Inc. All rights reserved.
Trademark Information