touch-action: manipulation需加在明确可点击元素上，如button、a、带role="button"的div等，避开滚动/缩放容器，且须配合视觉反馈与兼容处理。
直接用 touch-action: manipulation 就能解决，但只对明确可点击的元素生效，且必须避开滚动/缩放容器——写错位置或加在父容器上，反而会让页面滑不动。
哪些元素必须加 touch-action: manipulation
这个属性不会继承，浏览器只在触发 click 的上下文中检查它，所以得逐个加在真正响应点击的地方：
-
<button></button>、<a></a>这类原生可点击标签，直接加就行 - 自定义按钮（比如
<div onclick="...">），必须同时加 <code>role="button"或cursor: pointer，否则 iOS Safari 可能忽略 - 开关、弹窗关闭叉号、底部导航项、轮播图左右箭头——这些纯操作控件要单独设，别指望父容器带过去
- 用了
position: fixed或transform的按钮，在部分 Android WebView 中会被忽略，得额外补上 - 父容器设置了
touch-action: none（比如某些 Modal 组件、地图容器），会直接屏蔽子元素的manipulation - CSS 优先级被第三方样式覆盖，例如
* { touch-action: auto }这种通配符规则 - 元素没有交互语义：纯
<div> 即使写了 <code>touch-action: manipulation，iOS 也可能不加速 - 低版本 WebView 不支持：Android 4.4 内置 WebView 中
getComputedStyle(el).touchAction返回空字符串，说明未识别 - 一定要配
:active { opacity: 0.7; }或其他状态样式，比系统高亮更可控 - 顺手加
-webkit-tap-highlight-color: transparent，避免系统高亮和:active打架 - 如果还在用
fastclick，立刻停掉——它和touch-action冲突，会导致重复触发或事件丢失 - 安卓低端机 fallback 方案：用
touch-action: pan-y pinch-zoom+cursor: pointer，至少保基础点击态
为什么写了却没效果
常见失效不是语法错，而是被覆盖、被阻断或语义缺失：
必须搭配的视觉反馈和兼容处理
单靠 touch-action 只解决延迟，不提供视觉反馈。用户点下去“没反应”，体验照样差：
真正容易被忽略的是：这个属性只影响原生手势识别阶段，它不阻止点击穿透，也不改变事件冒泡顺序。弹层按钮点了背后还触发？那得靠 pointer-events: none 或层级隔离，不是调 touch-action 能解决的。
