微信扫一扫关注我们
关注有惊喜
加群获取更多免费资源
麦橙设计

使用CSS3移除点击交互元素时的高亮背景

发布时间:2014-10-10 11:49:43
摘要:...

在移动设备上测试实例时,你会发现当手指点击交互元素时,对应元素会出现一个半透明的高亮背景。设备浏览器不一样,颜色也会不一样,这种情况会影响用户的交互效果。如何快速解决这一问题,请看下面的CSS3代码:


-webkit-tap-highlight-color: rgba(255, 255, 255, 0); /* 使用这一句就可以达到去除高亮背景的效果 */
-webkit-user-select: none;
-moz-user-focus: none;
-moz-user-select: none;


新增了禁止选择文本的功能。其中,前两句对WebKit内核浏览器(Safari、Chrome、iPhone、iPad、Android等)有效,后两句对Gecko内核的浏览器(Firefox等)有效。