CSS2 - custom mouse cursor styles

If you were looking how to make a custom mouse cursor, you have come to the right place. Let's say you want to make your page a little bit stylish or just looking to updgrade some CSS2 knowledge about cursor styles, take a look and there's gotta be something for you. For every cursor style, you can copy the code and use it for yourself!
This time I will not define them in custom CSS stylesheet or in between style tags, but I will define and use them in element span, you can also use p, a, h1, h2, img and so on, it's your decision!
If you want to use them multiple times on site, it's better to define them in CSS.
This cursor property is supported in Internet Explorer, Mozilla, Opera, Google Chrome and Safari.

Auto and default mouse cursors

Auto cursor

Auto value depends on the element, used in most cases if you don't define a value.

<span style="cursor:auto">preview</span>

preview

Default cursor

Default value is defined in your OS or browser, which will be used on the pages.

<span style="cursor:default">preview</span>

preview

Pointer and crosshair cursors

Pointer cursor

Pointer value or known as hand cursor used in links.

<span style="cursor:pointer">preview</span>

preview

Crosshair cursor

Dunno what to say, check it out, and make your definition of crosshair value.

<span style="cursor:crosshair">preview</span>

preview

Help and move cursors

Help cursor

Displays help sign beside a pointer.

<span style="cursor:help">preview</span>

preview

Move cursor

Perhaps you know this cursor, used when you move the window or something.

<span style="cursor:move">preview</span>

preview

Progress and wait cursors

Progress cursor

Displays a progress bar beside a pointer.

<span style="cursor:progress">preview</span>

preview

Wait cursor

Displays a progress bar known as sand clock.

<span style="cursor:wait">preview</span>

preview

Text, vertical text select and not allowed cursors

Text select cursor

This value defines a selection symbol for text.

<span style="cursor:text">preview</span>

preview

Vertical text select cursor

This value defines a vertical selection symbol for text.

<span style="cursor:vertical-text">preview</span>

preview

Not allowed cursor

I guess, this doesn't need any explanation, so hover thru preview and you will see.

<span style="cursor:not-allowed">preview</span>

preview

Resize cursors

For east-west and north-south, I will paste two values which can be used, and both show the same.
In the bottom are defined row and col resize values.

East and west resize cursors

Both values look the same, so here you have both values.

<span style="cursor:e-resize">preview</span>
<span style="cursor:w-resize">preview</span>

preview
preview

North and south resize cursors

Both values look the same, so here you have both values.

<span style="cursor:n-resize">preview</span>
<span style="cursor:s-resize">preview</span>

preview
preview

South-east and north-west resize cursors

Both values look the same, so here you have both values.

<span style="cursor:se-resize">preview</span>
<span style="cursor:nw-resize">preview</span>

preview
preview

South-west and north-east resize cursors

Both values look the same, so here you have both values.

<span style="cursor:sw-resize">preview</span>
<span style="cursor:ne-resize">preview</span>

preview
preview

Row resize cursor

Usable for resizing rows

<span style="cursor:row-resize">preview</span>

preview

Col resize cursor

Usable for resizing cols

<span style="cursor:col-resize">preview</span>

preview

Custom mouse cursor

Just change the custom.cur with your location of the cursor image.
Tested only in IE6, so use it at your own risk!
FireFox3.5, Opera 9 and Chrome displays normal cursor.

<span style="cursor:url(custom.cur)">preview</span>

preview