セレクタ
CSSセレクタ
CSSを適用するHTML要素をブラウザに伝えるもの
マッチする要素すべてにCSSを適用する
任意の要素にマッチする
タグセレクタ
tag div , p , a etcクラスセレクタ
tag.class1 .class1 *.class1 の省略形idセレクタ
tag#id1 #id1 *#id1 の省略形特定のCSSの属性をもつ要素にマッチする
tag[attr] attr 属性をもつ tag タグにマッチ [attr] *[attr] の省略形？ tag[attr="attr1"] attr 属性が attr1 に一致する tag タグにマッチ tag[attr~="attr1"] attr 属性が attr1 を含む tag タグにマッチ tag[lang|="en"] lang 属性が en または en- から始まる値( en-us など)の tag タグにマッチ一般的に
lang 属性で使用 tag[attr^="attr1"] attr 属性の値が attr1 で始まる tag タグにマッチ tag[attr$="attr1"] attr 属性が attr1 で終わる tag タグにマッチ tag[attr*="attr1"] attr 属性が attr1 を含む tag タグにマッチ tag[attr1="attr1_"][attr2="attr2_"] attr1 属性が attr1_ に、 attr2 属性が attr2_ に一致する tag タグにマッチ擬似クラス
tag:pseudoclass 複数のセレクタを組み合わせる
.class1,.class2 class1 クラスまたは class2 クラスにマッチ .class1.s1 class1 s1 クラスにマッチ .div1 .class1 子孫セレクタ親
div1 クラスの子孫 class1 クラスにマッチ .div1 > .class1 子セレクタ親
div1 クラスの直接の子 class1 クラスにマッチ .class1 + .class2 兄弟セレクタ兄
class1 クラスの直後にある同じ親をもつ弟 class2 クラスにマッチ .class1 ~ .class2 一般兄弟セレクタ兄
class1 クラスの後にある同じ親をもつ弟 class2 クラスにマッチ参考