Caution

お使いのブラウザはJavaScriptが無効になっております。
当サイトでは検索などの処理にJavaScriptを使用しています。
より快適にご利用頂くため、JavaScriptを有効にしたうえで当サイトを閲覧することをお勧めいたします。

CSS辞典

トップページ
CSS辞典
【CSSセレクタ】E[foo]

【CSSセレクタ】E[foo]

『セレクタ[属性名]』で特定の属性を持つ要素のみに適用できます。一般に『属性セレクタ』と呼ばれます。この場合は属性の値は関係なく、属性を持っているだけで対象となります。IE6以下では動きませんのでご注意ください。

サンプルコード

p[id] { color: red;} /* id属性を持つp要素全てに適用されます。 */
p[title] { color: blue;} /* title属性を持つp要素全てに適用されます。 */
[class] { color: orange;} /* class属性を持つ要素全てに適用されます。『*[class]』と指定していることと同じです。 */

ブラウザでの表示結果

p[id] { color: red;} /* id属性を持つp要素全てに適用されます。 */
p[title] { color: blue;} /* title属性を持つp要素全てに適用されます。 */
[class] { color: orange;} /* class属性を持つ要素全てに適用されます。『*[class]』と指定していることと同じです。 */

<p id="hoge">ここはp要素です。id名に『hoge』と指定しています。</p>
<p>ここはp要素です。</p>
<p title="">ここはp要素です。title属性を指定していますが値は記述していません。</p>
<p class="hoge1">ここはp要素です。</p>

対応ブラウザ

デスクトップ

Chrome

1 以降 ○

Firefox

1 以降 ○

Safari

3 以降 ○

2 以前 ×

Edge

12 以降 ○

全バージョンで対応しています

11 ○

10 ○

9 ○

8 ○

7 ○

6 ×

Opera

9 以降 ○

8 以前 ×

モバイル

iOS Safari

1 以降 ○

Android Browser

4.4 以降 ○

3 以前 ×

Chrome Android