css3 去掉点击高光(移动端)

在我们用手机浏览网页时，当点击某个链接或者点击事件时 会出现一层蓝色半透明的高光显示，

但在开发webapp时，由于网页是被native load去的，在app里面点击的时候如果出现高光则显得很不和谐

css3 的-webkit-tap-highlight-color: rgba(0,0,0,0);的这个属性完美的解决了这个问题

你只去把他放在body里就可以了，通过属性值你可以清晰的知道它所表达的意思 rgba都为0，意思是黑色全透明

这样你点击的时候就不会有蓝色的半透明层了

代码如下：

body{-webkit-tap-highlight-color: rgba(0,0,0,0);}

当然你也可以根据自己的需要 比如说你希望点击的时候有灰色半透明层

那么将透明度设置下

 body{-webkit-tap-highlight-color: rgba(0,0,0,0.3);}

还可以设置不同的颜色

body{-webkit-tap-highlight-color: rgba(210,10,10,0.3);}

那么这时点击的时候就是一个红色半透明的层

转载于:https://www.cnblogs.com/leinov/p/3645494.html