删除在 ios safari/chrome/firefox 中点击的链接上的灰色背景

当你在 Safari (或者 chrome 或者 firefox)中为 iOS 点击(触摸)一个链接时，你会在链接后面看到一个灰色的背景(只有当你拿着它的时候)。有没有办法使用 CSS 来删除这个特性？

请参阅下面的示例图片:

enter image description here

57736

小开

最佳答案

Webkit 对此有一个特定的样式属性: -webkit-tap-highlight-color。

复制自: http://davidwalsh.name/mobile-highlight-colorー

/* light blue at 80% opacity */
html {
-webkit-tap-highlight-color: rgba(201, 224, 253, 0.8);
}


/* change it for a div that has a similar background-color to the light blue tap color */
.blueDiv {
-webkit-tap-highlight-color: rgba(251, 185, 250, 0.9);
}

如果要完全删除高光部分ー

.myButton {
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}