先记住这个答案
type="image" 把提交按钮画成图片。它的特殊点是点击后除正常表单字段外，还会提交点击位置在图像中的横、纵坐标。有 name 时坐标键名会带该名称前缀；没有 name 时通常是 x 与 y。这项能力适合坐标本身有意义的图形地图，普通“立即购买”按钮通常用 <button> 更清楚。
- 它是提交按钮，不是普通图片
- 点击会提交相对图片的坐标
- 具名字段会形成
.x与.y alt应说明按钮动作
坐标数据来自哪里
若用户在图片内部点击某个位置，浏览器记录相对图像的坐标，并把它加进这次提交。服务器如果用坐标判断地图上的目标区域，就要考虑图片实际渲染尺寸、缩放和布局变化；不能拿设计稿上的固定像素直接推断点击位置。
<form action="/pick" method="get">
<input type="image" name="map" src="/areas.png"
alt="在地图上选择区域" width="300" height="200">
</form>
<!-- 点击后可能出现 map.x 和 map.y 参数 -->这里的 alt 说明操作目的，图片加载失败或读屏时仍能理解按钮。若只是普通图标提交按钮，更推荐文字清晰的 <button type="submit">，不必让服务端处理无用坐标。
无障碍与交互边界
图片上的文字若没有等价文本，图片加载失败或读屏环境下用户可能不知道会提交什么。alt 应描述按钮动作，例如“搜索”或“选择区域”，不能只写文件名。还要保证焦点可见、图片对比度足够，且不要把关键选项只放在难以精确点击的区域。
type="image" 与普通图片 <img> 不同：前者会发起表单提交，也支持部分提交按钮覆盖属性。服务器收到坐标后不应直接把它当作可信的权限证明，任何客户端数据都可被伪造。
坐标不是安全可靠的“地图选区”依据。用户用键盘激活按钮、没有在图上明确点选位置时，坐标默认是 (0, 0)；服务端若把它解释成左上角区域，可能误判用户意图。缩放和响应式尺寸也会改变图上同一视觉位置对应的 CSS 像素。若业务真的需要选区域，应另提供清楚的文字选项或可访问的点选界面，并在服务端重新验证坐标范围，而不是只靠这两个提交项。
容易答错的地方
- 把它当普通图片元素
- 它是提交控件，点击可能触发校验、发送表单并产生坐标数据。
- 只给图片画了字而不写
alt - 辅助技术和图片失败场景需要文本名称说明操作。
面试官还会怎么问？
有 name="map" 时参数叫什么？
浏览器会生成以该名称为前缀的横纵坐标项，如 map.x 和 map.y。
图片按钮需要 value 吗？
它的图像来自 src，坐标是特殊提交数据；不要把它按普通文本按钮的 value 使用。
普通提交按钮为什么更推荐 <button>？
文本名称、样式和响应式布局更容易控制，也不会生成无意义的点击坐标。
参考资料
示例用于理解所注明的运行环境与边界；延伸学习可结合原文中的更多案例。