cursor

value: [ [ ,]* [ auto | crosshair | default | pointer | move | e-resize | ne-resize | nw-resize | n-resize | se-resize | sw-resize | s-resize | w-resize | text | wait | help | progress ] ] | inherit
initial value: auto
inherited: yes
percentages: N/A
applicable to: all elements

The property of cursor will change the symbol for the cursor as indicated. There may be instances where you want the cursor symbol to change when the user moves over a certain element. The user agent, or browser, will have a default set of cursors for web pages. This property will override the browsers settings.

The possible values are as stated below (for some of the values, you may see an example by hovering over the grey box):

  auto: This puts the display for the cursor as the default value for the browser. You do not need to state this unless you wish to override previous styling for that element.
  crosshair: displays a crosshair for the element.
  default: this is platform-dependant default cursor (usually an arrow for monitors)
  pointer: displays a little pointing hand. This is often used to indicate a link.
  move: displays a four-arrowed cursor that indicates something is to be moved.
  e-resize:displays a two-arrowed cursor that indicates something is to be moved in the East direction.
  ne-resize: displays a two-arrowed cursor that indicates something is to be moved in the NE direction.
  nw-resize: displays a two-arrowed cursor that indicates something is to be moved in the NW direction.
  se-resize: displays a two-arrowed cursor that indicates something is to be moved in the SE direction.
  sw-resize: displays a two-arrowed cursor that indicates something is to be moved in the SW direction.
  s-resize: displays a two-arrowed cursor that indicates something is to be moved in the South direction.
  w-resize: displays a two-arrowed cursor that indicates something is to be moved in the West direction.
  text: displays an I-beam shaped cursor - often associated with forms to enter text.
  wait: displays an hour-glass cursor indicating that the user is to wait for something to occur.
  progress: displays a cursor that tells the user that some process is running, but that the user may still interact with the page, most often an hour glass and an arrow.
  help: displays an arrow with a question mark indicating that help is offered with the element under the cursor.
  url: A URL for a graphic can be used if the developer wishes to have his own cursor displayed.

Example:

.linkarea {cursor: pointer;}

Hover over this box
and a pointer cursor
will appear.