0

Internet Explorer 10 (モバイル版) では、選択ボックス () がフォーカスされるとすぐに青色で強調表示されます (携帯電話のモダン UI サーフェス全体の青色です)。select タグのスタイル:

border-radius: 5px 5px 5px 5px;
font-size: 14px;
height: 25px;
letter-spacing: -1px;
float: left;
font-weight: 400;
padding: 0 5px 0 5px;
-webkit-appearance: none;
-ms-user-select: none;
background-origin: content-box, content-box;
background-repeat: no-repeat, repeat;
background-size: 11px 6px, 1px 160px;
background-position: right center, 0 -1px;
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABcAAAAMAQMAAACz9bS7AAAABlBMV…vQuZgJjsYojkBJQf75i4cGzcXt5HJQ/Djs7L5sApGeVNPJDzbGEbOb/85rAAAAAElFTkSuQmCC), url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAlgCAIAAADGR8ryAAACZ0lEQ…tDzV5P+JnOAzg9qR2Xlg+a8jAvtyK/P5fSI6Sf3c3NhwADAJ0Rj8qbukvYAAAAAElFTkSuQmCC);
border: 1px solid #CCCCCC;

「-ms-user-select: none」で修正されることを期待していましたが、修正されませんでした..似たような経験をした人はいますか?

4

3 に答える 3

1

IE には、このハイライトを処理するための独自の CSS 疑似要素があります。

CSS:

select::-ms-value{ background-color: transparent; color: black; }

詳細については、このページを参照してください。

于 2013-12-02T07:36:04.947 に答える
1

WP7とWP8で同様の問題が発生しました。解決策は、フォーカスを選択ボックスからクリックイベントの偽の入力に移動することです。

jQuery:

$('select').on('click', function() {
    $('input.fakeInput').focus().blur()
})

CSS:

.fakeInput {
    display: block;
    width:0;
    height:0;
    top: -999rem;
    position: absolute;
}

注: このコードはモバイル デバイス用にのみ追加することを忘れないでください。デスクトップ ブラウザーでは期待どおりに動作しません。

于 2013-04-23T13:12:21.960 に答える