-webkit-tap-highlight-color: transparent 是唯一能关闭点击高亮的CSS属性，但仅对WebKit内核生效（如iOS Safari、微信X5），且必须作用于可激活元素（如a、button、role="button"），值须为transparent或rgba(0,0,0,0)，不继承、不支持伪类，禁用后需用data-active等JS方案补反馈。
-webkit-tap-highlight-color: transparent 是唯一能直接关掉它的 CSS 属性，但必须写对位置、值和目标元素，否则白写。
为什么 -webkit-tap-highlight-color: transparent 常常没反应
失效几乎从不因为拼写错误，而是环境或匹配问题：
- 只对 WebKit 内核生效（iOS Safari、微信 X5），Android Chrome 62+ 已彻底忽略它，写了也看不到效果
- 不能写在
* {}或body {}上——某些旧版微信 X5 WebView 会白屏；必须作用于可激活元素本身 - 值必须是
transparent或rgba(0,0,0,0)；none、unset、rgba(255,255,255,0)都无效 - 不继承、不支持伪类，
a:active { -webkit-tap-highlight-color: transparent; }完全没用
哪些元素必须显式加这个样式
它只对“可激活元素”自身生效，不是所有带 onclick 的 div 都自动命中。确保目标节点满足以下任一条件：
- 原生语义元素：
a、button、input[type="button"]、input[type="submit"] - 自定义按钮：同时带
role="button"和tabindex="0"，且绑定了click或touchstart - 动态渲染节点（如 Vue 的
v-if、React 的useState切换）若没同步role或tabindex，高亮会重新出现
推荐统一写法：a, button, input[type="button"], input[type="submit"], [role="button"][tabindex="0"], [onclick]
立即学习“前端免费学习笔记（深入）”；
禁用后用户点下去没反馈怎么办
-webkit-tap-highlight-color 是系统级视觉反馈，关掉后你得自己补上，否则用户容易误判是否点中：
-
:active伪类无法替代它——在 iOS 上延迟明显、持续时间极短（约 100–200ms），肉眼几乎不可见 - 更稳的做法是用 JS 切换
data-active状态，再配 CSS：[data-active] { transform: scale(0.95); transition: transform 0.15s ease; } - 如果元素内含需复制的内容（如电话号码），不能整块禁用
user-select，应把可选文本用<span class="selectable">包裹，再对.selectable单独设user-select: text
真正难处理的是混合场景：比如一个 div 同时绑了 click 和 touchstart，又用了 FastClick 类库，这时候高亮行为可能被多次拦截或延迟触发，得逐层排查事件流。
