通常，元素在按压态/点击态时会使用 :active伪类 来设置特定的样式，这个操作在pc/Android上都没有问题，但 iOS上的点击事件（click）是模拟出来的，在iOS上使用 :active 伪类 需要设置一个touch事件，这样元素的:active伪类才能被正确触发。一般是给body标签上加一个ontouchstart属性，但是但是~注意body的渲染范围，要保证元素上的touch事件能冒到body上才行。
除了:active伪类外，还有一条css属性更适合做“点元素时元素上面覆盖一层遮罩颜色”的效果：-webkit-tap-highlight，此属性非标准，只有WebKit/Safari, Blink/Chrome和某些版本的IE、Edge可以用。
可是有时候，-webkit-tap-highlight在iOS上并不能像预期一样工作，这就和Safari on iOS上“clickable 元素”的概念分不开了。
在iOS，当用户tap一个clickable的元素时，事件会按mouseover → mousemove → mousedown → mouseup → click的顺序到达，然后用户tap另一个clickable元素的时候才触发这个元素的mouseout事件；而当用于tap一个nonclickable元素的时候，啥事件都不会发生，如图所示：
因此，给一个被识别成了nonclickable的元素设置-webkit-tap-highlight-color属性是没用的。
不过可以给nonclickable的元素加一些响应用户操作的事件/css属性，让它被识别成clickable元素，例如：
- cursor: pointer;
- οnclick=“void(0)”
还可以用一些天生自带clickable的标签换掉nonclickable(主要是 div)的元素：
- 带有href属性的
<a> - 带href属性的
<area> <button><img><input>- 绑了form的
<label> <textarea>- …
参考文档