属性セレクター

指定された属性を持つ HTML 要素のスタイルを設定します。

class 属性や id 属性だけでなく、指定した属性を持つ HTML 要素のスタイルを設定できます。

注: IE7 および IE8 は、!DOCTYPE が指定されている場合にのみ属性セレクターをサポートします。 IE6 以前では、属性の選択はサポートされていません。

属性セレクター

次の例は、title 属性を持つすべての要素をスタイルします:

[title]{color:red;}

属性と値のセレクター

次の例は、title="php" を持つすべての要素をスタイルします。

属性および値セレクター - 複数の値

次の例では、指定された値を持つ title 属性を含むすべての要素のスタイルを設定します。スペースで区切られた属性値に適用されます:

[title=php]{border:5px solid blue;}

次の例では、指定された値を含む lang 属性を持つすべての要素のスタイルを設定します。ハイフンで区切られた属性値に適用されます:

[title~=hello] { color:red; }

属性セレクターは、クラスまたは ID なしでフォームをスタイル設定する場合に特に役立ちます:

[lang|=en] { color:red; }