[CSS3]attribute selector

attribute selectorは属性値を使って要素を選択できるセレクター。

使い方は、簡単で[]内にattribute selectorを定義する。

[attribute selector] {
}

例

/* attributeという属性を持つ要素を選択 */
[attribute] {
}

/*
class="hogs"を持つ要素を選択
class="hogs fuga"はマッチしないので選択されない
*/
[class="hogs"] {
}

/* class属性の値がhogeから始まる要素を選択 */
[class^="hoge"] {
}

/* class属性の値がfugaで終わる要素を選択 */
[class$="fuga"] {
}

/*
class属性の値の中で、スペースで区切られた値「hoge」がある要素を選択

class="hogs fuga"やclass="hoge"が選択される
*/
[class~="hoge"] {
}