cursor

Sets the type of pointer to be displayed as the pointer moves over the object.

Syntax

{ cursor: sCursor }

Possible values

sCursor

String that specifies one or more of the following possible values, separated by commas:

auto	Default. Browser determines which pointer to display based on the current context.
all-scroll	Arrows pointing up, down, left, and right with a dot in the middle, indicating that the page can be scrolled in any direction.
col-resize	Arrows pointing left and right with a vertical bar separating them, indicating that the item/column can be resized horizontally.
crosshair	Simple cross hair.
default	Platform-dependent default pointer; usually an arrow.
hand	Hand with the first finger pointing up, as when the user moves the pointer over a link.
help	Arrow with question mark, indicating that help is available.
move	Crossed arrows, indicating that something is to be moved.
no-drop	Hand with a small circle with a line through it, indicating that the dragged item cannot be dropped at the current pointer location.
not-allowed	Circle with a line through it, indicating that the requested action will not be performed.
pointer	Hand with the first finger pointing up, as when the user moves the pointer over a link. Identical to hand.
progress	Arrow with an hourglass next to it, indicating that a process is running in the background. User interaction with the page is unaffected.
row-resize	Arrows pointing up and down with a horizontal bar separating them, indicating that the item/row can be resized vertically.
text	Editable text; usually an I-bar.
url(uri)	Pointer is defined by the author, using a custom Uniform Resource Identifier (URI), such as url('mycursor.cur'). Pointers of type .CUR and .ANI are the only supported pointer types.
vertical-text	Editable vertical text, indicated by a horizontal I-bar.
wait	Hourglass or watch, indicating that the program is busy and the user should wait.
*-resize	Arrows, indicating an edge is to be moved. The asterisk (*) can be n, ne, nw, s, se, sw, e, or w, where each represents a compass direction.

This property has a default value of auto. It is inherited.

Remarks

The property handles a comma-separated list of values. If the browser cannot find or is otherwise unable to use the first pointer specified, it moves to the next pointer in the comma-separated list and continues until it finds a usable pointer. If the browser cannot use any of the pointers that are listed, the pointer does not change.

Examples

The following example uses the cursor property to change the pointer as it passes over an object. This example uses a call to an embedded (global) style sheet to set the pointer to hand as the pointer passes over all paragraphs:

<style>
    p {cursor: hand;}
</style>

This example uses inline scripting to set the pointer to hand as the pointer passes over the paragraph:

<p onmouseover="this.style.cursor='hand'">

Standards information

This property is defined in Cascading Style Sheets (CSS), Level 2 (CSS2) .

Applies to

a, address, applet, b, big, blockquote, body, caption, center, cite, code, col, colgroup, custom, dd, defaults, dfn, div, dl, dt, em, embed, fieldset, form, hn, hr, html, i, iframe, img, input type=button, input type=checkbox, input type=file, input type=image, input type=password, input type=radio, input type=reset, input type=submit, input type=text, li, object, ol, p, rt, ruby, s, span, sub, table, tbody, td, tfoot, th, thead, tr, tt, u, ul, var, xmp

Send feedback about this topic to Microsoft. © 2011 Microsoft Corporation. All rights reserved.