H5 -- 取消a标签在点击时的背景颜色

原文链接：点我

1、取消a标签在移动端点击时的蓝色

1 a {
2 -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
3 -webkit-user-select: none;
4 -moz-user-focus: none;
5 -moz-user-select: none;
6 }


2、使用图片作为a标签的点击按钮时，当触发touchstart的时候，往往会有一个灰色的背景

1 a,a:hover,a:active,a:visited,a:link,a:focus{
2 -webkit-tap-highlight-color:rgba(0,0,0,0);
3 -webkit-tap-highlight-color: transparent;
4 outline:none;
5 background: none;
6 text-decoration: none;
7 }

3、改变选中内容的背景颜色

 1 ::selection { 
 2 background: #FFF; 
 3 color: #333; 
 4 } 
 5 ::-moz-selection { 
 6 background: #FFF; 
 7 color: #333; 
 8 } 
 9 ::-webkit-selection { 
10 background: #FFF; 
11 color: #333; 
12 }

4、去除ios input框点击时的灰色背景

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

5、去除ios中图片被选中时的蓝色背景

1 img {
2 -webkit-tap-highlight-color:rgba(0,0,0,0);
3 -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
4 -webkit-user-select: none;
5 -moz-user-focus: none;
6 -moz-user-select: none;
7 user-select: none;
8 }
posted @ 2019-08-22 16:39  王小道  阅读(2622)  评论(0)  编辑  收藏  举报