The cursor property allow you to change the appearance of the cursor on an element of a web page.
The client will automatically display the cursor on his computer that matches the type of cursor you choose.
Example of a cross shaped cursor (crosshair):
One can of course give different styles to several elements of the same page
Example of a style as a cross on the "body" style decorated with a hourglass shape on the images and hand on the links.
List of possible attributes
Accepted by all browsers
- Self: Appearance same as the default cursor on the tag that has the attribute does not change.
- Default: Cursor default browser.
- Pointer: Cursor shaped hand with his finger unfolded.
- Text: Cursor text editing.
- Help: Cursor help.
- Wait: Wait Cursor
- Progress: Slider progression.
- Move: Cursor movement.
- Crosshair: Cursor-shaped cross.
- N-resize: resize cursor to the bottom up.
- S-resize: resize slider top to bottom.
- E-resize: resize cursor left to right.
- W-resize: resize cursor right to left.
- Ne-resize: Resize Cursor bottom-left to top right.
- Nw-resize: Resize Cursor bottom-right to top left.
- Se-resize: resize cursor top-left to bottom right.
- Sw-resize: resize cursor top right to bottom left.
- Note that: In fact, it is easy to remember all these properties at once.
- n, s, e, w correspond to the north, south, east, west, ie up, down, right, left.
- Simply indicate the direction in which the cursor is pointing, followed of course "-resize".
Not supported by all browsers
Firefox and Opera, ignore the following guidelines.
- Inherit: Even as the cursor parent tag.
- Not-allowed: Cursor shaped round strikeout.
- No-drop: Cursor shaped hand with fingers and a round unfolded strikeout.
- Col-resize: Cursor is two vertical lines with an arrow on each side.
- Row-resize: Cursor is two horizontal lines with an arrow on each side.