Scholar Repository
Home>Manual>CSS Cursor Property

CSS Cursor Property

From http://www.w3schools.com (Copyright Refsnes Data)

CSS cursor Property


CSS Reference Complete CSS Reference


Definition

The cursor property specifies the type of cursor to be displayed when pointing on an element.

Inherited: Yes


JavaScript Syntax

CSS properties can also be dynamically changed with a JavaScript.

Scripting Syntax: object.style.cursor="text"

In our HTML DOM tutorial you can find more details about the cursor property.

In our HTML DOM tutorial you can also find a full Style Object Reference.


Example

h2
{
cursor: crosshair
}

p
{
cursor : url("first.cur"), url("second.cur"), pointer
}

Possible Values

Value Description
url

The url of a custom cursor to be used.

Note: Always define a generic cursor at the end of the list in case none of the url-defined cursors can be used

default The default cursor (often an arrow)
auto Default. The browser sets a cursor
crosshair The cursor render as a crosshair
pointer The cursor render as a pointer (a hand) that indicates a link
move The cursor indicates something that should be moved
e-resize The cursor indicates that an edge of a box is to be moved right (east)
ne-resize The cursor indicates that an edge of a box is to be moved up and right (north/east)
nw-resize The cursor indicates that an edge of a box is to be moved up and left (north/west)
n-resize The cursor indicates that an edge of a box is to be moved up (north)
se-resize The cursor indicates that an edge of a box is to be moved down and right (south/east)
sw-resize The cursor indicates that an edge of a box is to be moved down and left (south/west)
s-resize The cursor indicates that an edge of a box is to be moved down (south)
w-resize The cursor indicates that an edge of a box is to be moved left (west)
text The cursor indicates text
wait The cursor indicates that the program is busy (often a watch or an hourglass)
help The cursor indicates that help is available (often a question mark or a balloon)



Try-It-Yourself Demos

Change the cursor
This example demonstrates how to change the cursor.


CSS Reference Complete CSS Reference

From http://www.w3schools.com (Copyright Refsnes Data)

Home>Manual>CSS Cursor Property