用css去掉a标签点击时的默认背景色

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/HY_358116732/article/details/80182608

我们在写移动端html页面时，经常用a标签写成按钮，但是点击用a标签写成的按钮时，有默认的背景色，如果我们不想要这个默认背景色怎么办？

以下提供几种方法供大家参考：

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

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

   -webkit-user-select: none;

   -moz-user-focus: none;

   -moz-user-select: none;

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

   a,a:hover,a:active,a:visited,a:link,a:focus{

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

   -webkit-tap-highlight-color: transparent;

   outline:none;

   background: none;

   text-decoration: none;

   }

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

   ::selection {

   background: #FFF;

   color: #333;

   }

   ::-moz-selection {

   background: #FFF;

   color: #333;

   }

   ::-webkit-selection {

   background: #FFF;

   color: #333;

   }

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

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