如何去掉移动端网页点击按钮和a标签上的阴影



  • 下图是我在手机上做的一个测试,点击以后默认系统会给按钮加上了一个阴影样式,a标签上也会有这个阴影,影响视觉美观,请问一下如何去除

    9d1321a8-b890-475b-8169-470cc0b7c5c5-image.png



  • 可以在全局加入如下样式

    * {
        -webkit-tap-highlight-color: transparent;
    }
    

    另外你可能会遇到按钮聚焦后会有黄边的问题,这个可以添加下面的代码解决

    *:focus {
       outline: none;
    }
    

Log in to reply