CSSの詳細情報 対応ブラウザ Windows MAC IE 5.0以上/FF1.0/NS7.1/OP8.0 ※一部未対応 SF/IE5.0 CSSレベル CSSレベル1

マウスでクリックしているときや、マウスのカーソルがある部分にフォーカスされている時にのみ働くスタイルシートの指定方法です。例えば、フォームの入力中にだけフォームの背景色を変えたりすることができます。これら「：active」や「：focus」のことを「動的擬似クラス」と言います。

アクティブとは、ブラウザの画面上でマウスをクリックしてから離すまでの動作を指します。指定した要素をアクティブにしているときにその要素に書式を適用させることができます。

フォーカスとは、ブラウザの画面上でマウスをクリックし、入力状態にあるまでの動作を指します。指定した要素をフォーカスにしているときにその要素に書式を適用させることができます。

これらの動的擬似クラスが適用できる要素はブラウザによって対応状況が様々です。また、中には、「：active」と「：focus」を同時に指定しなければ動作しない要素もあります。

activeを適用できる要素 IE 5.0以上 NS7.1 FF1.0 OP8.0 SF MAC IE5.0 a （リンク） ○ ○※ ○※ ○ ○ ○ input type="text" （1行テキスト） × × × ○ ○ × input type="radio" （ラジオボタン） × × × ○ × × input type="checkbox" （チェックボックス） × × × ○ × × input type="botton" （汎用ボタン） × ○※ ○※ ○ × ○ select （リストボックス） × × × × × × textarea （複数行テキスト） × × × ○ ○ × div （汎用ブロックレベル要素） × ○ ○ ○ ○ × ※「：focus」を併用する場合は、「：focus」を「：active」の前に書くことが必要

引用元（一部改）：藤本 壱、スタイルシート ポケットリファレンス、技術評論社、P57、2005

focusを適用できる要素 IE 5.0以上 NS7.1 FF1.0 OP8.0 SF MAC IE5.0 a （リンク） ○ ○ ○ × ○ ○ input type="text" （1行テキスト） × ○ ○ ○ ○ ○ input type="radio" （ラジオボタン） × × × ○ × × input type="checkbox" （チェックボックス） × × × ○ × × input type="botton" （汎用ボタン） × ○ ○ ○ × ○ select （リストボックス） × ○ ○ ○ × ○ textarea （複数行テキスト） × ○ ○ ○ ○ ○

※引用元（一部改）：藤本 壱、スタイルシート ポケットリファレンス、技術評論社、P57、2005

次のページへ >>