我们对Windows各种各样的鼠标样式都不陌生，当鼠标移动到不同的地方时，当鼠标执行不同的功能时，当系统处于不同的状态时，都会使鼠标的形状发生变化。而在网页上往往只有当鼠标在超级链接上时才出现一个手形，在其它地方似乎没有什么变化，同充满动感的网页显得不怎么和谐。这里教大家用CSS来定义20种种鼠标样式形状。在CSS中，使用来定义鼠标的样式。
用css控制鼠标样式的语法如下:
<span style="cursor:*">文本或其它页面元素</span>
把 * 换成如下20个可选值的一种：
cursor属性取值如下，默认值为default。大家可能会说，cursor属性值这么多，怎么记呀？其实大家不用担心，在实际开发中，我们一般只用到"default"和"pointer"这两个属性值，其他的一般都很少用得上。如果实在没办法还需要其他的，那就回来查这种表就行了。
| Property | 描述 | 描述 | |
|---|---|---|---|
| crosshair; | 十字准心 | The cursor render as a crosshair 光标表现为十字准线 | |
| cursor: pointer; cursor: hand; 写两个是为了照顾IE5，它只认hand。 | 手 | The cursor render as a pointer (a hand) that indicates a link 光标标以暗示(手指)的形式来表明有一个连接 | |
| cursor: wait; | 等待/沙漏 | The cursor indicates that the program is busy (often a watch or an hourglass) 光标暗示当前程序正忙(一般为一块表或是一个沙漏) | |
| cursor: help; | 帮助 | The cursor indicates that help is available (often a question mark or a balloon) 光标暗示当前位置可得到帮助(一般为问号或是气球) | |
| cursor: no-drop; | 无法释放 | cursor: no-drop; | |
| cursor: text; | 文字/编辑 | The cursor indicates text 光标暗示当前所处位置为文字内容 | |
| cursor: move; | 可移动对象 | The cursor indicates something that should be moved 光标暗示一些东西应该被移动 | |
| cursor: n-resize; | 向上改变大小(North) | The cursor indicates that an edge of a box is to be moved up (north) 边缘可向上移动(北) | |
| cursor: s-resize; | 向下改变大小(South) | The cursor indicates that an edge of a box is to be moved down (south) 边缘可向下方移动(南) | |
| cursor: e-resize; | 向右改变大小(East) | The cursor indicates that an edge of a box is to be moved right (east) box边缘可向右(东)边移动 | |
| cursor: w-resize; | 向左改变大小(West) | The cursor indicates that an edge of a box is to be moved left (west) 边缘可向左移动(西) | |
| cursor: ne-resize; | 向上右改变大小(North East) | The cursor indicates that an edge of a box is to be moved up and right (north/east) 光标暗示box的边缘可向右上方移动(东北方向) | |
| cursor: nw-resize; | 向上左改变大小(North West) | The cursor indicates that an edge of a box is to be moved up and left (north/west) 边缘可向左上方移动(西北) | |
| cursor: se-resize; | 向下右改变大小(South East) | The cursor indicates that an edge of a box is to be moved down and right (south/east) 边缘可向右下方移动(东南) | |
| cursor: sw-resize; | 向下左改变大小(South West) | The cursor indicates that an edge of a box is to be moved down and left (south/west) 边缘可向左下方移动(西南) | |
| cursor: auto; | 自动 | The browser sets a cursor 浏览器设置一个光标 | |
| cursor:not-allowed; | 禁止 | cursor:not-allowed; | |
| cursor: progress; | 处理中 | cursor: progress; | |
| cursor: default; | 系统默认 | The default cursor (often an arrow) 默认的光标状态（通常为一个箭头） | |
| cursor: url(' # '); # = 光标文件地址 (注意文件格式必须为：.cur 或 .ani)。 | 用户自定义（可用动画） | The url of a custom cursor to be used. 自定义光标的url位置 Note: Always define a generic cursor at the end of the list in case none of the url-defined cursors can be used 注意：在定义完自定义的光标之后在末尾加上一般性的光标，以防那些url所定义的光标不能使用 |
cursor的pointer与hand区别
cursor:hand 与 cursor:pointer 的效果是一样，都像手形光标。那为什么有两个呢，这两个有什么区别呢？
用浏览器测试得出以下结论：
cursor:hand ：IE完全支持。但是在 firefox 是不支持的，没有效果。
cursor:pointer ：是 CSS2.0 的标准。所以 firefox 是支持的，但是 IE5.0 既之前版本不支持。IE6 开始支持。
所以为了兼容各个主流浏览器，尽量使用 cursor:pointer，而不要使用 cursor:hand。
实例：
实例
css
#div_default{cursor:default;}
#div_pointer{cursor:pointer;}
在浏览器预览效果如下：
CSS Cursor鼠标指针样式兼容性参考表
下面分享一个鼠标指针样式兼容性在线参考表， 黑色图标：表示该属性兼容此浏览器。 灰色图标：表示该属性不兼容此浏览器。