css 的 cursor 属性用于设置鼠标悬停时的指针样式，提升交互反馈；支持 default、pointer、text、move、not-allowed、wait 等系统值，以及 url() 自定义图片光标（需 fallback），但 ie 仅支持 .cur/.ani，移动端 safari 不支持自定义图片。
CSS 中通过 cursor 属性可以轻松修改鼠标悬停在元素上时的指针样式，控制交互反馈，提升用户体验。
浏览器内置了多种光标类型，直接赋值即可生效：
- default：默认箭头（通常无需显式设置）
- pointer：小手图标，常用于可点击元素（如按钮、链接）
- text：I 形光标，表示可文本输入或选中（如 input、p 标签）
- move：四向箭头，适合拖拽操作区域
- not-allowed：圆圈斜杠，表示当前不可操作
- wait：沙漏或旋转图标，提示加载中
支持使用 PNG、GIF 等格式的图片作为光标，需指定尺寸和热区位置：
- 语法：
- 推荐尺寸：32×32 像素以内，部分浏览器对大图支持不佳
- 可加坐标偏移（如 ），第二个值为 x 偏移，第三个为 y 偏移，单位是像素
- 必须提供 fallback（逗号后的一个系统光标），否则自定义失败时会回退为默认箭头
实际使用中需注意以下细节：
立即学习“前端免费学习笔记（深入）”；
- IE 仅支持 .cur 和 .ani 格式，不支持 PNG 直接作为光标（除非转成 .cur）
- 移动端 Safari 不支持自定义图片光标，但系统光标值基本都可用
- 慎用 —— 虽然可行，但会隐藏光标，影响可访问性和操作反馈，不建议常规使用
- 建议对交互元素（如按钮、卡片、表单项）统一设置 cursor，保持行为一致
给所有链接加手型光标：
禁用某个按钮的点击态：
为拖拽容器设置移动光标：
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容，请联系我们，一经查实，本站将立刻删除。
如需转载请保留出处：https://51itzy.com/kjqy/222906.html