用CSS3解决移动端手指点击或滑动屏幕时出现的浅蓝色背景框

默认情况下，移动端手机网站当手指点击某元素时，该元素会出现一个浅蓝色的背景框，如果是链接，点击完就加载到新的页面去了，可能感觉不太明显，但是如果做一些效果，比如手指滑动屏幕的效果，就感觉比较明显了

因为滑动这个动作细拆开来，就是手指先点击屏幕某处，然后再进行手指移动，你会发现被点击到的元素后边总有个浅蓝色背景，虽然你手指离开后它自己会消失，也不影响大局，但是总会感觉还是不够完美，那么这个问题如何解决呢？

在CSS3中，有一个属性“-webkit-tap-highlight-color”，我们不想要那个点击产生的背景框的话，只需要在body样式中设置该属性rgba中的alpha值为0即可，具体写法如下：

-webkit-tap-highlight-color: rgba(0,0,0,0)

这样设置以后，移动端手机网站手指点击或滑动屏幕时就不会再出现那个浅蓝色背景框了，当然，如果你想保留这个背景框，而只是改变下这个背景框的颜色，同样是用该属性，修改对应rgba即可。