Built-in Cursors

Cursors are changed to signal that the element that is under the cursor can be clicked, selected, or dragged. The cursor can be customized to be any image and even animated. However, it is much easier to use the built-in cursors, which can be set without supplying any additional files or URLs.

There are 20 built-in cursors that can be used in HTML, as shown below: auto, crosshair, default, e-resize, grab, help, move, n-resize, ne-resize, nw-resize, pointer, progress, s-resize, se-resize, sw-resize, text, w-resize, wait, not-allowed, and no-drop. In the code below, we create two types of elements for each of these cursors: block (div) and inline (span). To see the cursor change, move the cursor over each of the elements.

Output