:-moz-focusring

非標準: この機能は標準ではなく、標準化の予定もありません。公開されているウェブサイトには使用しないでください。ユーザーによっては使用できないことがあります。実装ごとに大きな差があることもあり、将来は振る舞いが変わるかもしれません。

CSS:-moz-focusring 擬似クラスは、 :focus 擬似クラスに似た Mozilla 拡張ですが、現在フォーカスが当たっていて、かつフォーカスリングやその他のインジケーターがその周りに描かれる場合のみ一致します。

重要: このセレクターは CSS Selectors 4 仕様で :focus-visible に改名されました。

:-moz-focusring に一致すると :focus にも一致しますが、逆は常に成り立つとは限りません。ユーザーエージェントがフォーカスリングの描画を有効にしているかどうか、どのようにして要素にフォーカスが当たったかによります。ユーザーエージェントがフォーカスリングの描画を有効にしているかどうかは、オペレーティングシステムの設定やその他の要因によりますので、この擬似クラスの詳細な動きはプラットフォームごとに異なります。

作業グループは以前、この機能を CSS Selectors 4 または 5 で :focus-ring として追加する意向を持っており、改名が決定され :focus-visible となり、 CSS Selectors 4 に追加されました。

: 開発者は :-moz-focusring を、 focus 状態がユーザーによるマウスのクリックキーボードのタブ移動のどちらで行なわれたのかを区別するために使う傾向があります。これはカスタム要素を作成し、振る舞いに応じてスタイルを変更したい場合にも便利かもしれません。

構文

:-moz-focusring

HTML

<input />

CSS

input {
  margin: 5px;
}

:-moz-focusring {
  color: red;
  outline: 2px dotted green;
}

結果

仕様書

どの仕様にも含まれていません。

ブラウザーの互換性

No compatibility data found for css.selectors.-moz-focusring.
Check for problems with this page or contribute missing data to mdn/browser-compat-data.

関連情報