73

:focusセレクターがあるのは知っています。:blurセレクターの使用またはドキュメントが見つからないようです。ありますか？

4

4 に答える 4

121

:blurCSS には疑似クラスはありません。

動的疑似クラスは、他の疑似クラスや実際には他のすべてのセレクターと同様に、状態を表します。それらは、ドキュメント ツリーに関してイベントや状態間の遷移を表すものではありません。つまり、:focus疑似クラスは、フォーカスされている要素を表します。フォーカスを受け取ったばかりの要素を表すものではなく、フォーカスを失った:blurばかりの要素を表す疑似クラスも存在しません。

同様に、これは:hover疑似クラスにも当てはまります。はポインティング デバイスを持つ要素を表しますが、指され:mouseoverたばかりの要素の疑似クラスも、から離れたばかりの要素の疑似クラスもありません。:mouseout

フォーカスされていない要素にスタイルを適用する必要がある場合は、次の 2 つの選択肢があります。

  1. 使用:not(:focus)(ブラウザーのサポートが少ない場合):

    input:not(:focus), button:not(:focus) {
    /* Styles for only form inputs and buttons that do not have focus */
}

  2. フォーカス状態に関係なくすべての要素に適用されるルールを宣言し、フォーカスのある要素をオーバーライドします。

    input, button {
    /* Styles for all form inputs and buttons */
}

input:focus, button:focus {
    /* Styles for only form inputs and buttons that have focus */
}
于 2012-07-28T17:47:46.847 に答える
7

いいえ、おそらくぼかしは状態というよりもイベントであるため、CSS にはぼかし疑似セレクターがありません。(何かがいつぼかし状態を失うかは不明です)。

于 2012-07-28T17:40:23.037 に答える
3

すべての通常のセレクターは、デフォルトではフォーカスされていません。したがって、特別なぼかしセレクターは必要ありません。

これらは、優先順位によるセレクターです。

.myButton
.myButton:hover
.myButton:focus
.myButton:active
于 2012-07-28T17:46:42.873 に答える