控制光标的属性

　　通过CSS的cursor属性可以改变光标在目标组件上的形状。该属性支持如下属性值。
　　➢　all-scroll：代表十字箭头光标。
　　➢　col-resize：代表水平拖动线光标。
　　➢　crosshair：代表十字线光标。
　　➢　move：代表移动十字箭头光标。
　　➢　help：代表带问号的箭头光标。
　　➢　no-drop：代表禁止光标。
　　➢　not-allowed：代表禁止光标。
　　➢　pointer：代表手型光标。
　　➢　progress：代表带沙漏的箭头光标。
　　➢　row-resize：代表垂直拖动线光标。
　　➢　text：代表文本编辑光标。通常就是一个大写的I字光标。
　　➢　vertical-text：代表垂直文本编辑光标。通常就是大写的I字光标旋转90度。
　　➢　wait：代表沙漏光标。
　　➢　*-resize：代表可在各种方向上拖动的光标。支持w-resize、s-resize、n-resize、e-resize、ne-resize、sw-resize、se-resize、nw-resize等各种属性值，其中n代表向上方向，s代表向下方向，e代表向右方向，w代表向左方向。

例子
<!DOCTYPE html>  
<html>  
<head>  
    <meta http-equiv="Content-Type" content="text/html; charset=GBK" />
    <title> 光标相关属性 </title>
    <style type="text/css">
        div {
            display: inline-block;
            border: 1px solid black;
            width: 160px;
            height: 70px;
        }
    </style>
</head>  
<body>  
<div style="cursor:all-scroll;">十字箭头光标</div>  
<div style="cursor:col-resize;">水平拖动线光标</div>  
<div style="cursor:crosshair;">十字线光标</div>  
<div style="cursor:move;">代表移动十字箭头光标</div>  
<div style="cursor:help;">带问号的箭头光标</div>  
<div style="cursor:no-drop;">禁止光标</div>  
<div style="cursor:not-allowed">禁止光标</div>  
<div style="cursor:pointer;">手型光标</div>  
<div style="cursor:progress;">带沙漏的箭头光标</div>  
<div style="cursor:row-resize;">垂直拖动线光标</div>  
<div style="cursor:text;">文本编辑光标</div>  
<div style="cursor:vertical-text;">垂直文本编辑光标</div>  
<div style="cursor:wait;">沙漏光标</div>  
<div style="cursor:n-resize;">可向上拖动的光标</div>  
<div style="cursor:ne-resize;">上、右可拖动的光标</div>  
<div style="cursor:se-resize;">下、右可拖动的光标</div>  
</body>  
</html>

注：本博客内容节选自李刚编著的疯狂HTML 5/CSS 3/JavaScript讲义 ，详细内容请参阅书籍。