HOME

ABOUT

ARCHIVES

CONTACT

css

セレクタの指定方法と優先順位

区切り方 概要
カンマ[ , ] h1,p h1とpどちらにも適用
スペース [ ] h1 p h1の中のp要素に適用
不等号[ > ] #id>p #id直下のp要素に適用
プラス[ + ] #id+p #idに隣接している要素に適用
何もなし #id.class #id要素のうちclassだけ適用
[要素]:first-child #id:first-child #id要素のうち最初の子要素に適用
[要素]:last-child #id:last-child #id要素のうち最後の子要素に適用
[要素]:nth-child(数字) #id:nth-child(2) #id要素のうち括弧内の数字番目の要素に適用
[要素]:nth-child(odd) #id:nth-child(odd) #id要素のうち括弧内の奇数番目の要素に適用
[要素]:nth-child(even) #id:nth-child(even) #id要素のうち括弧内の偶数番目の要素に適用
[要素]:nth-child(数字n) #id:nth-child(3n) #id要素のうち3の倍数(4倍も可)にある要素に適用
[要素]:nth-child(数式) #id:nth-child(3n+1) #id要素のうちかっこの数式にあてはまる要素に適用
[要素]:not(要素) #id:not(last-child) #id要素中の括弧内で指定した要素・セレクタ以外に適用
かっこ[要素^=”要素名”] p[class^=”sec”] p要素に対してクラス名がsecで始まるものに適用