CSS 去掉点击时的选区和阴影
阅读(11077)在移动设备下,点击链接时,会有一个响应点击的灰色区域;如果用户长按,还会出现一个“复制”等的弹框。
在某些场景下,去掉以上的系统响应可以通过如下代码:
<style type="text/css">
div,a,img {
-webkit-tap-highlight-color: transparent;
-webkit-touch-callout: none;
-webkit-user-select: none;
user-select:none;
}
</style>
div 这些标签,也是需要一并加上的,取决于你的点击事件。
参考
tap-highlight-color:http://ued.ctrip.com/webkitcss/prop/tap-highlight-color.html
user-select 的MDN介绍:https://developer.mozilla.org/zh-CN/docs/Web/CSS/user-select
-webkit-touch-callout 的MDN介绍:https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-touch-callout
document.body.addEventListener('touchstart', function () {});
iOS需要加这个监听,才可以生效。