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

时间:2012-08-09 14:00:12

标签: ios css mobile-safari mobile-chrome

当您点击(触摸)iOS中的链接(或Chrome或firefox)时,您会在链接后面看到灰色背景(仅在您持有时)。有没有办法使用CSS删除此功能?

请参阅下面的示例图片:

enter image description here

2 个答案:

答案 0 :(得分:156)

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);
}

答案 1 :(得分:4)

由于某些原因,最新版本的iOS忽略了RGBA颜色。

要删除它,我不得不使用以下内容:

list()

如此处所述: https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-tap-highlight-color