cursor属性能设哪些合法值
不是所有字符串都能当cursor值用，浏览器只认标准关键字、URL路径或auto这类保留字。写错会直接回退到默认箭头，连报错都不会抛——你改了半天没反应，大概率是拼错了grab写成grap，或者not-allowed漏了短横线。
常见合法值分三类：
-
default、pointer、text、move、grab/grabbing、not-allowed——这些是跨浏览器最稳的 -
url()自定义图片，但必须配, auto兜底，否则在图片加载失败或不支持时整个光标就消失了 -
context-menu这种新值，在旧版Safari里不生效，别指望它做核心交互提示
用url()加自定义光标图片要注意什么
想用url(./cursor.png)？先确认三件事：图片尺寸是否≤32×32像素（Windows限制）、是否有透明通道、是否带热区坐标。
热区坐标不写，默认以左上角为点击点，结果就是鼠标指哪点哪，但视觉上光标中心偏了——用户拖拽时总感觉“对不准”。正确写法是：
立即学习“前端免费学习笔记（深入）”；
cursor: url(./hand.cur), pointer;
注意：.cur格式比.png更稳妥，原生支持热区；如果非用.png，得补两个数字，比如url(./hand.png) 8 8, pointer，表示从左上角偏移8px处为热区。
cursor在hover和disabled状态下的行为差异
很多人以为给button:disabled设cursor: not-allowed就完事了，其实没用——:disabled伪类本身不触发hover，而cursor只有在元素可交互且被悬停时才生效。真正该做的是：
- 给
button[disabled]直接加cursor: not-allowed（属性选择器，不是伪类） - 避免在父容器上设
cursor再靠继承，因为button自己有默认cursor: default，会覆盖继承值 - React/Vue里动态禁用按钮时，记得同时切换
className或内联样式，不能只靠disabled属性
移动端 Safari 对 cursor 的特殊处理
iOS Safari 完全忽略cursor属性——无论你写pointer还是url()，手指点下去永远是系统默认样式。这不是 bug，是设计如此。所以别在响应式项目里给@media (hover: hover)以外的场景设cursor，否则会误导开发判断。
真要区分触摸/悬停，得靠媒体查询配合：
@media (hover: hover) and (pointer: fine) {<br> .btn { cursor: pointer; }<br>}
否则在Mac触控板+鼠标混用设备上，cursor可能意外生效又突然消失。
热区坐标、兜底值、移动端失效——这三个点漏掉任何一个，光标就会在某个环境里“失踪”或者“错位”，而且很难一眼定位问题。
