极客教程CSS 光标
CSS的光标属性允许您指定应显示给用户的光标类型。
此属性的一个好用途是在表单上使用图像作为提交按钮。默认情况下，当光标悬停在链接上时，光标会从指针变为手形。然而，在表单上的提交按钮上光标不会改变形状。因此，每当有人将光标悬停在作为提交按钮的图像上时，它会提供一个视觉提示该图像是可点击的。
下表显示了光标属性的可能值：
| 序号 | 值和描述 |
|---|---|
| 1 | auto 光标的形状取决于它所在的上下文区域。例如，在文本上是I型，链接上是手型，等等… |
| 2 | crosshair 十字线或加号标志 |
| 3 | default 一个箭头 |
| 4 | pointer 一个指向手型（在IE 4中此值是hand） |
| 5 | move I型竖线 |
| 6 | e-resize 光标表示要向右（东）移动一个框的边缘 |
| 7 | ne-resize |
| 8 | nw-resize 该光标指示需要向上和向左移动框的边缘（北/西） |
| 9 | n-resize 该光标指示需要向上移动框的边缘（北） |
| 10 | se-resize 该光标指示需要向下和向右移动框的边缘（南/东） |
| 11 | sw-resize 该光标指示需要向下和向左移动框的边缘（南/西） |
| 12 | s-resize 该光标指示需要向下移动框的边缘（南） |
| 13 | w-resize 光标表示要向左（西）移动一个框的边缘 |
| 14 | text 垂直的I形光标 |
| 15 | wait 一个小时的沙漏 |
| 16 | help 一个问号或气球，非常适合用于帮助按钮 |
| 17 | <url> 光标图像文件的源 |
注意 − 您应该尝试仅在用户希望看到光标的位置添加有用的信息。例如，当某人悬停在链接上时，使用十字准星可能会让访问者感到困惑。
这是一个例子 −
<html>
<head>
</head>
<body>
<p>Move the mouse over the words to see the cursor change:</p>
<div style = "cursor:auto">Auto</div>
<div style = "cursor:crosshair">Crosshair</div>
<div style = "cursor:default">Default</div>
<div style = "cursor:pointer">Pointer</div>
<div style = "cursor:move">Move</div>
<div style = "cursor:e-resize">e-resize</div>
<div style = "cursor:ne-resize">ne-resize</div>
<div style = "cursor:nw-resize">nw-resize</div>
<div style = "cursor:n-resize">n-resize</div>
<div style = "cursor:se-resize">se-resize</div>
<div style = "cursor:sw-resize">sw-resize</div>
<div style = "cursor:s-resize">s-resize</div>
<div style = "cursor:w-resize">w-resize</div>
<div style = "cursor:text">text</div>
<div style = "cursor:wait">wait</div>
<div style = "cursor:help">help</div>
</body>
</html>
它将产生以下结果 −
