Cursor style in CSS3

How to get differenet shape/style of mouse pointer using CSS?

Cursor

The cursor property of CSS allows you to specify the type of cursor that should be displayed to the user. when a cursor hovers over a link, the cursor changes from a pointer to a hand. However, it does not change form for a submit button on a form. Therefore, whenever someone hovers over an image that is a submit button, it provides a visual clue that the image is clickable.

 <p><i style="font-size:30px"><b>Place the cursor to see the changes in the cursor</b></i></p>
    <p style="cursor:auto">Auto</p>
    <p style="cursor:help">Help</p>
    <p style="cursor:text">text</p>
    <p style="cursor:wait">wait</p>
    <p style="cursor:w-resize">w-resize</p>
    <p style="cursor:sw-resize">sw-resize</p>
    <p style="cursor:se-resize">se-resize</p>
    <p style="cursor:s-resize">s-resize</p>
    <p style="cursor:n-resize">n-resize</p>
    <p style="cursor:ne-resize">ne-resize</p>
    <p style="cursor:nw-resize">nw-resize</p>
    <p style="cursor:e-resize">e-resize</p>
    <p style="cursor:move">Move</p>
    <p style="cursor:pointer">Pointer</p>
    <p style="cursor:default">default</p>
    <p style="cursor:crosshair">Crosshair</p>
    <p style="cursor:cell">cell</p>
    <p style="cursor:context-menu">Contextmenu</p>
    <p style="cursor:copy">Copy</p>
    <p style="cursor:col-resize">Colresize</p>
    <p style="cursor:no-drop">Nodrop</p>
    <p style="cursor:none">none</p>
    <p style="cursor:not-allowed">notallowed</p>
    <p style="cursor:row-resize">rowresize</p>
    <p style="cursor:vertical-text">vertical text</p>
    <p style="cursor:zoom-in">zoom in</p>
    <p style="cursor:zoom-out">zoomout</p>
    <p style="cursor:alias">align</p>

In the above code snippet we have defined the different cursor functions it is used to place the different types of the cursor functions

output