在前端开发中，cursor CSS 属性控制鼠标指针的样式。常用的 cursor 值有很多，以下是一些例子，并按类别分组：
基本光标:
default: 默认光标，通常是一个箭头。auto: 浏览器根据上下文自动选择合适的游标。none: 隐藏光标。
文本选择:
text: 文本输入光标，通常是一个竖线 (I-beam)。vertical-text: 垂直文本输入光标。
链接选择:
pointer: 手形光标，通常用于链接、可点击元素。help: 问号光标，表示帮助信息可用。
拖放和调整大小:
move: 移动光标，通常是四向箭头。grab: 抓取光标，表示可以抓取元素。grabbing: 抓取中光标，表示正在抓取元素。crosshair: 十字准星，常用于精确选择或绘图。e-resize,w-resize,n-resize,s-resize,ne-resize,nw-resize,se-resize,sw-resize: 调整大小光标，分别表示向东、西、北、南、东北、西北、东南、西南调整大小。ew-resize,ns-resize: 水平和垂直调整大小光标。
等待/忙碌:
wait: 等待光标，通常是一个旋转的圆圈或沙漏。progress: 进度光标，表示正在进行操作，但用户仍然可以进行交互。
其他:
not-allowed: 禁止光标，通常是一个带有斜线的圆圈。zoom-in: 放大光标，表示可以放大。zoom-out: 缩小光标，表示可以缩小。cell: 单元格选择光标。context-menu: 上下文菜单光标。
使用自定义光标:
除了预定义的值外，还可以使用 url() 指定自定义光标图像：
.element {cursor: url('path/to/cursor.png'), auto; /* auto是备用光标 */
}
示例:
<!DOCTYPE html>
<html>
<head>
<style>
div {width: 100px;height: 100px;margin: 10px;float: left;
}#div1 {cursor: pointer;}
#div2 {cursor: move;}
#div3 {cursor: text;}
#div4 {cursor: wait;}
#div5 {cursor: help;}
</style>
</head>
<body><div id="div1">pointer</div>
<div id="div2">move</div>
<div id="div3">text</div>
<div id="div4">wait</div>
<div id="div5">help</div></body>
</html>
以上只是一些常用的 cursor 值，还有其他一些不太常用的值。 选择合适的 cursor 值可以提高用户体验，并提供清晰的视觉反馈。 建议根据具体场景选择合适的 cursor 值。
