CSS GUIDE CURSOR

From CDOT Wiki
Jump to: navigation, search

This document is a work in progress and is subject to change.

Summary

Cursor CSS property specifies the type of mouse cursor displayed over an element.

Syntax

cursor: [crosshair]

Legal Values

Value Description
url url of custom cursor. Always followed by pointer if previous cursors can't be found
default Default cursor
auto Browser sets a cursor
crosshair Cross cursor
pointer Hand cursor
move Move cursor cross
e-resize East resize cursor
ne-resize North East resize cursor
nw-resize North west resize cursor
n-resize North resize cursor
se-resize South east resize cursor
sw-resize Sourth west resize cursor
s-resize South resize cursor
w-resize West resize cursor
text Text cursor
wait Hourglass cursor
help Question mark cursor

Mozilla Recommended Values

Usage Examples

 <html>
  <body>
  <span style="cursor:auto">
  Auto</span><br />
  <span style="cursor:crosshair">
  Crosshair</span><br />
  <span style="cursor:default">
  Default</span><br />
  <span style="cursor:pointer">
  Pointer</span><br />
  <span style="cursor:move">
  Move</span><br />
  <span style="cursor:e-resize">
  e-resize</span><br />
  <span style="cursor:ne-resize">
  ne-resize</span><br />
  <span style="cursor:nw-resize">
  nw-resize</span><br />
  <span style="cursor:n-resize">
  n-resize</span><br />
  <span style="cursor:se-resize">
  se-resize</span><br />  
  <span style="cursor:sw-resize">
  sw-resize</span><br />
  <span style="cursor:s-resize">
  s-resize</span><br />
  <span style="cursor:w-resize">
  w-resize</span><br />
  <span style="cursor:text">
  text</span><br />
  <span style="cursor:wait">
  wait</span><br />
  <span style="cursor:help">
  help</span>
  </body>
 </html>

Notes

Specification Conformance

Browser Compatibility

Firefox,Netscape,Opera,IE

See Also