CSS 删除在 ios safari / chrome / firefox 中单击的链接上的灰色背景
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11885161/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
remove grey background on link clicked in ios safari / chrome / firefox
提问by sam
When you click (touch) a link in Safari (or chrome or firefox) for iOS, you get a grey background behind link (only while you're holding it). Is there a way to remove this feature using CSS?
当您在 iOS 的 Safari（或 chrome 或 firefox）中单击（触摸）链接时，链接后面会出现灰色背景（仅当您按住它时）。有没有办法使用 CSS 删除此功能？
Please see the example image below:
请看下面的示例图片：
回答by pk-nb
Webkit has a specific style property for that: -webkit-tap-highlight-color.
Webkit 有一个特定的样式属性：-webkit-tap-highlight-color.
Copied from: http://davidwalsh.name/mobile-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);
}
If you want to remove the highlight completely—
如果你想完全去除高光——
.myButton {
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
回答by Peter Browse
Latest versions of iOS are ignoring RGBA colors for some reason.
出于某种原因，最新版本的 iOS 忽略了 RGBA 颜色。
To remove it, I ended up having to use the following:
要删除它，我最终不得不使用以下内容：
-webkit-tap-highlight-color: transparent;
As documented here: https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-tap-highlight-color
如此处所述：https: //developer.mozilla.org/en-US/docs/Web/CSS/-webkit-tap-highlight-color
