在小程序或者是移动端开发过程中,总是会碰到当你点击一个可以点击的元素的时候,在这个元素下会出现一个高亮的正方形浅蓝色背景。
效果如下:![在这里插入图片描述](https://img-blog.csdnimg.cn/20201112143618670.png#pic_center)
解决方案:
通过属性 -webkit-tap-highlight-color
进行解决。
属性概述:
当用户点击iOS的Safari浏览器中的链接或JavaScript的可点击的元素时,覆盖显示的高亮颜色。
具体内容见:-webkit-tap-highlight-color
要解决这个问题,就可以通过禁用这个高亮就可以,只需要设置颜色的alpha值为0即可。
page {
-webkit-tap-highlight-color: rgba(0,0,0,0);
}