Blogging Tips

CSS: cursor

As you surely already know we can change the cursor type using CSS.
They way we do it is very simple. It is enough to use the cursor property and apply it to any element in our web page:

<style>
.myDiv {
   cursor: crosshair;
}
</style>
<div class="myDiv">The cursor here has a crosshair shape</div>

What are the different option we have?
The answer after the break :-)


In order to see the different effects, please move your cursor on the appropriate cursor type in the following table.

URL URLs to custom cursors. The live test won't work obviously.

auto

crosshair

default

e-resize

help

move

n-resize

ne-resize

nw-resize

pointer

progress

s-resize

se-resize

sw-resize

text

w-resize

wait

inherit