shape="default"必须置于所有area标签之后且不可带coords属性，否则被浏览器静默丢弃；它仅响应未被其他area覆盖的像素区域，不随缩放自适应，亦不支持无障碍提示。
shape="default" 必须放在所有其他 area 之后
浏览器按 area 在 map 中的顺序渲染热点区域，“先定义的区域优先覆盖”。如果把 shape="default" 写在前面，它会直接占满整张图，后面所有 rect、circle 都点不到。
正确顺序是：先写具体形状（如行星图标），最后用一个 area 定义 shape="default" 作为兜底区域。
-
shape="default"不需要coords属性——加了会被忽略，甚至导致部分浏览器报解析警告 - 它只响应“未被其他
area覆盖的像素”，不是整张图的 fallback，而是真正的剩余区域 - 如果图像有透明背景或留白，
default区域就只落在那些空白像素上，不是“默认点击跳转”意义上的 fallback
default 不是万能兜底，别指望它替代 JS 逻辑
shape="default" 的行为完全由浏览器坐标系统决定：它计算的是所有已定义 area 的像素级覆盖结果，再取反。这意味着：
- 如果两个
area坐标重叠，后写的那个会覆盖前一个，default只能拿到最终没被任何area命中的位置 - 它不感知缩放、CSS transform 或
object-fit—— 图片被拉伸或裁剪后，default仍按原始尺寸计算剩余区域 - 无法设置
title或alt来提示用户“这里可点”，屏幕阅读器对default区域的支持极弱
coords 属性与 default 冲突时浏览器怎么处理
只要写了 coords，哪怕 shape="default"，主流浏览器（Chrome/Firefox/Safari/Edge）都会直接忽略这个 area。不是报错，也不是降级，是静默丢弃整条标签。
立即学习“前端免费学习笔记（深入）”；
常见误写：
<area shape="default" coords="0,0,100,100" href="fallback.html">
这段代码在 DevTools 里根本不会出现在渲染树中，Network 也看不到请求触发。验证方法很简单：删掉 coords 后刷新，链接就能点了。
-
shape="default"是唯一一个不允许带coords的合法值 - 写成
shape="default" coords=""或coords=" "同样无效——空字符串或空格不等于“无属性” - HTML5 标准明确要求：当
shape为default时，coords必须被完全省略
真正需要 fallback 时，该用什么替代 default
如果你要的是“点图上任意位置都跳转”，shape="default" 并不适合——它只管“没被别的 area 盖住的地方”。更可靠的做法是：
- 去掉
usemap，直接给img加onclick或包裹a标签，实现全图点击 - 用 SVG 替代
map+area：SVG 的<path></path>支持响应式、缩放自适应，还能用pointer-events精确控制哪些区域可交互 - 如果必须保留图像映射结构，用
shape="rect"覆盖整图尺寸（如coords="0,0,145,126"）并放在最后，效果接近但语义不同
default 的设计初衷从来不是“用户友好 fallback”，而是让多边形热点之间能自然留出间隙区域——这点很容易被忽略，但恰恰是它存在的全部意义。
