CSS Cookbook

3.4. Changing Cursors

Problem

You want to change the cursor when the mouse pointer rolls over a link, as in Figure 3-3.

Figure 3-3. The wait cursor represented by a watch icon

Solution

Use the cursor property to change the cursor:

a:link, a:visited {
 cursor: move;  
}

Discussion

The cursor property can take multiple values, as listed in Table 3-2. However, support for these values varies from browser to browser. Opera 7 and Internet Explorer for Windows 5.5+ support the cursor property. While Netscape Navigator 6+ supports most values, the browser doesn’t support the uri. Also, in Navigator the cursor property isn’t inherited to child elements from the parent.

Table 3-2. Cursor property values and their descriptions

Value	Description	Sample
auto	The cursor changes to an image that is determined by the browser.
crosshair	Two perpendicular lines intersecting in the middle; this is similar to an enlarged plus sign.
default	Platform-dependent cursor that in most browsers is rendered as an arrow. Browser vendors or computer operating systems may dictate a different cursor style.