<area>标签不支持cursor样式，必须通过父级<img>或容器设置；shape和coords错误会导致区域失效；响应式下坐标失准是手型“失效”主因；自定义光标需检查协议、路径及fallback；移动端忽略该样式。
area标签本身不支持cursor样式，必须靠父级img或容器触发
直接给 <area> 元素写 cursor: pointer 是无效的——它没有渲染盒（rendering box），CSS 样式不会生效。浏览器只把它当坐标描述器，不参与视觉绘制。想让鼠标悬停时变手型，得从它的“宿主”入手。
常见做法是：把 <img> 包在 <div> 里，给该 <div> 设置 cursor: pointer；或者直接给 <img> 加 style="cursor: pointer"。这样整个图片区域都会响应，包括所有 <area> 覆盖区。
- ✅ 推荐：
<img src="map.jpg" usemap="#mymap" style="cursor: pointer"> - ⚠️ 注意：如果图片被
object-fit或 CSS 缩放拉伸，<area>坐标会错位，但 cursor 样式仍会显示——这容易造成“看起来能点，实际点不中”的假象 - ❌ 不要尝试：
<area style="cursor: pointer">—— 完全无效果，控制台也不会报错
shape和coords写错会导致area失效，手型也跟着消失
area 的 shape 属性只接受四个严格小写值：rect、circle、poly、default。拼错一个字母，比如 shape="Rect" 或 shape="polygon"，整个 <area> 就被浏览器静默丢弃——既不跳转，也不响应 hover，更不会触发手型。
同时 coords 必须与 shape 数量匹配且**不能有空格**：
立即学习“前端免费学习笔记（深入）”；
-
shape="rect"→coords="10,20,100,80"（左上 x,y + 右下 x,y） -
shape="circle"→coords="50,60,25"（圆心 x,y + 半径 r） -
shape="poly"→coords="30,40,90,40,60,120"（至少 6 个数，偶数个，首尾不需重复） - 少一位或多一位，坐标解析就会偏移，热点区域错位甚至归零，hover 效果自然失效
响应式页面里area手型失效的真正原因不是CSS，是坐标失准
很多人以为加了 cursor: pointer 就万事大吉，结果在移动端或缩放后点不中。问题不在光标样式，而在 <area> 的坐标系是硬编码像素值，以原始图片左上角为原点，**完全不响应 CSS 缩放、max-width、transform: scale() 或 object-fit。
例如一张 800×600 的图，用 width: 100%; max-width: 400px 显示，<area coords="100,100,200,200"> 实际热点会落在缩放后图片的约 50×50 像素处，远小于预期。
- ? 真实可行的解法：改用 SVG
<image>+<use>或<polygon>，SVG 坐标天然响应缩放 - ? 不推荐 hack：用 JS 动态重算 coords——维护成本高，且无法覆盖 pinch-zoom、系统字体缩放等场景
- ⚠️ default area（
shape="default"）虽能覆盖整图，但必须是<map>中最后一个，且不能带coords，否则整个 map 解析失败
自定义光标（如 .cur 或 .png）在area区域不生效的排查重点
即使你用了 cursor: url("hand.cur"), pointer，在 <area> 上依然看不到——因为自定义光标只继承自其最近的可渲染祖先元素（如 <img> 或包裹它的 <div>），而 <area> 自身不可渲染，无法“承载” cursor 声明。
更关键的是：本地开发时走 file:// 协议，url() 会被浏览器安全策略拦截，直接降级到 fallback（如 pointer），控制台还可能不报错。
- ✅ 验证方式：打开开发者工具 → Elements → 找到
<img>元素 → 查看 Computed 样式里的cursor值是否为url(...)；若显示为pointer，说明图片加载失败 - ✅ 必做三件事：起本地服务（如
npx http-server）、确保路径相对于 CSS 文件、fallback 关键字不能省略（cursor: url("x.cur"), auto合法，cursor: url("x.cur")无效） - ⚠️ 移动端 Safari 和 Android Chrome 完全忽略
cursor声明，area 区域在手机上永远是系统默认光标，别为此做兼容性投入
