何らかの理由で、CSSの::selection
宣言が機能していないため、デフォルト(Chromeの淡い青色の背景)として常に動作しています。見る方法:: Chromeデベロッパーツールでの選択
コードはこのように私の仮定は、プロジェクトのどこかで何か上書きされている
::selection {
background: red;
}
a jsbinで正常に動作しますが、私はどこにもスタイルシートで::selection
の別の宣言を見つけることができません。デベロッパーツールでこれを見て、プロジェクトでなぜ機能していないのかを特定またはデバッグしようとする方法があるかどうかは疑問でした。
CSSを指定しても、!important
という宣言は役に立ちません。
編集
OK、私は追加することによって、さらにデバッグしようとした:
<style type="text/css">
::selection, ::-moz-selection {
background: red !important;
}
</style>
を文書のフッターに、ひいてはそれが、1が1つのステートメントでこれらの2つの宣言を組み合わせることはできませんことが判明これは3210にクリスCoyierで言及されました:
私は疑問を持っている:なぜ:: S置くcan't選挙と:: - moz-selectionを一緒にして、両方の値を定義しますか?そうすれば、FFは値を無視します。
これは良いCSSレッスンです!ブラウザがセレクタのいずれかの部分を理解しない場合、セレクタ全体が(カンマで区切られていても)無視されます( )。 の例外がいくつかありますが、ほとんどの場合古いブラウザ(IE 7?)にあります。
すべてがうまくいっていて、もう一度やり直しても問題はないと思いますが、devtoolsでこの宣言をどうにかして見る方法はありますか?
編集2
[OK]を、もちろん、宣言は独自の行に座っているとき、それはインスペクタに表示されます。
編集3
非常に関連のSOの質問:私はちょうど驚いWhy isn't it possible to combine vendor-specific pseudo-elements/classes into one rule set?
は、Chromeはちょうどまだ不正な形式のインスペクタでの宣言ではなく、それを完全に隠して表示されません。
面白いことに、私はクロムは今、そのルールを無視して驚いたということです。それは〜には役に立たなかった。少なくとも、Safariはこれを使用していないし、まだそれがあるかどうかわからない。 – BoltClock