web-dev-qa-db-ja.com

iOSサファリでクリックされたリンクの灰色の背景を削除する/ chrome / firefox

IOSのSafari（またはchromeまたはfirefox）でリンクをクリック（タッチ）すると、リンクの背後に灰色の背景が表示されます（それを保持している間のみ）。 CSSを使用してこの機能を削除しますか？

下のサンプル画像をご覧ください：

enter image description here

ioscssmobile-safarimobile-chrome
64
sam

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);
}
161
pk-nb

IOSの最新バージョンは、何らかの理由でRGBAカラーを無視しています。

削除するには、次のものを使用する必要がありました。

-webkit-tap-highlight-color: transparent;

ここに記載されているとおり： https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-tap-highlight-color

1
Peter Browse