ios safari 点击高亮需用 -webkit-tap-highlight-color: rgba(0,0,0,0) 显式关闭，仅 transparent 在旧版 ios 失效；须确保元素可交互，且优先局部设置，避免影响表单可访问性。
iOS Safari 点击元素时默认有半透明灰色高亮，不是 bug，是 WebKit 的主动反馈机制；关掉它不难，但直接设 transparent 在某些 iOS 版本会失效，得配齐写法。
为什么 -webkit-tap-highlight-color: transparent 有时没用
老版本 iOS（如 iOS 7–9）对 transparent 解析不一致，部分机型会 fallback 到默认色；同时，该属性只对「可点击的元素」生效——比如没加 cursor: pointer、没绑定点击事件、或元素被 pointer-events: none 拦截，高亮可能照常出现。
- 必须确保目标元素有交互能力（
onclick、role="button"或tabindex） - 不能只写
transparent，推荐补上完全不透明的 rgba 值：rgba(0,0,0,0) - 若元素是
<a></a>标签，还需检查是否被text-decoration: none以外的样式干扰（比如父级overflow: hidden可能截断高亮渲染）
全局关闭 vs 局部关闭：选哪个更安全
全局关（比如在 body 或 *:not(input):not(textarea) 上设）看似省事，但容易误伤原生表单控件——iOS 对 <input type="checkbox"> 或 <select></select> 的点击反馈依赖这个高亮，关了反而降低可访问性。
- 优先局部关闭：只加在自定义按钮、列表项、手写
div模拟的交互区域上 - 避免用通配符选择器（如
* { -webkit-tap-highlight-color: ... }），Safari 渲染时可能触发重排 - 如果项目用 Vue/React，建议在组件 scoped style 里写，防止污染第三方 UI 库
iOS 15+ 的新行为：tap-highlight-color 被部分忽略
iOS 15 开始，Safari 对某些 CSS 触发的点击（比如 ontouchstart + preventDefault）会跳过高亮渲染，但这不是标准行为，不能当兼容方案。更麻烦的是，如果页面启用了 viewport 的 user-scalable=no，部分机型会强制恢复高亮，且无法通过 CSS 关闭。
- 不要依赖「不写就等于关闭」——没声明时默认值是
#00000080（半黑） - 真要彻底禁用，CSS 必须显式声明，且推荐写两遍：
-webkit-tap-highlight-color: rgba(0,0,0,0);tap-highlight-color: rgba(0,0,0,0);（后者是草案属性，部分新版 Safari 已支持） - 遇到高亮「时有时无」，先检查是否混用了
touch-action: manipulation——它和高亮机制存在竞争
最稳的写法就三行，但得嵌进具体元素里，而不是扔在 reset.css 最底下；另外，别忘了测真机——模拟器里点十次都不出高亮，不代表用户手指划过 iPhone 屏幕时也一样。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
