| Cursor appearance is determined by the CSS property cursor. CSS property cursor allows to set own cursor appearance for page elements, and one can use both standard cursors and custom cursors (CUR files or SVG cursors). CSS property cursor is a property for changing cursor appearance. For the sake of simplicity, let’s divide cursors into groups. Standard cursors
auto – default cursor for the current element.
crosshair - simple crosshair (resembling "+" character).
default - cursor, used by default on the given platform. It is often represented by an arrow.
pointer - cursor is represented as a pointer, designating a link.
move - cursor, which determines an object that can be moved.
e-resize, ne-resize, nw-resize, n-resize, se-resize, sw-resize, s-resize, w-resize - cursors, indicating possibility to move some edge of an object.
text - cursor, indicating the text that can be highlighted. It is often represented by a vertical line "|".
wait - cursor, meaning that program is busy and a user should wait. It is often represented by a dial or a sand glass.
help - cursor, meaning that there is help information for the pointed object. It is often represented as a question mark or a balloon. Example:
Code SPAN.help { cursor : help; } Custom cursor:
You may need a cursor with unusual appearance. Then you should specify the following as a cursor property value: url('path to a cursor'), standard cursor
Examples: Code
P { cursor : url("my.cur"), text; }
P { cursor : url("my.svg"), url("my.cur"), auto; }
When a browser meets definition of a custom cursor, it tries to image the first cursor from the list. If the first cursor cannot be imaged, then the browser tries to use the next cursor on the list. Note, that there must always be some standard cursor at the bottom of the list of custom cursors, in case not one of custom cursors can be imaged. As a custom cursor, one can use CUR, ANI files or SVG cursors. SVG cursor is a platform-independent custom cursor, where the cursor itself is an image file. It is recommended to use PNG format, for it supports transparency mask via alpha-channel, however GIF may be used as well, for it supports 2-bit transparency. In another image format is used, which doesn’t support transparency neither via alpha-channel nor through assigning a separate color in the capacity of a transparent one, then the cursor will be imaged as a non-transparent square area. It is necessary to use at least two colors for a cursor, so that it was distinguishable on various backgrounds. Custom cursors are supported starting with IE6, Firefox 1.5. Firefox 1.5 supports CUR and SVG cursors, and doesn’t support ANI format. IE supports CUR and ANI formats, but doesn’t support SVG cursors. The property cursor is inherited.
There is also such value as "inherit". It indicates that a property is inherited from a parent element.
Default value for cursor property: auto Use custom cursors if there is a real reason to do it. Remember, that standard cursors are usual and understandable for users.
| 
