カスケーディング順序とSpecificity - CSS
カスケーディングの順序
CSSでは、宣言は次の優先順位でカスケーディングされる。
- スタイルシートの種類と!importantキーワードの有無
- UAのデフォルトスタイルシート
- ユーザスタイルシート
- 作者スタイルシート
- 作者スタイルシート(!importantキーワードあり)
- ユーザスタイルシート(!importantキーワードあり)
- セレクタのSpecificity
- スタイルシートの読み込み順・宣言の記述順
セレクタのSpecificity
セレクタのSpecificityは、次の規則に基づいて算出された値、a,b,c,dを左から並べたものとなる。
- style属性に記述されている場合はa=1、それ以外はa=0とする。
- セレクタに含まれるIDの数をbとする。
- セレクタに含まれる属性と擬似クラスの数をcとする。
- セレクタに含まれる要素型名と擬似要素の数をdとする。
- クラスセレクタ(
.class)は属性(c)として数えられる。
- 属性セレクタによるID属性のマッチング(
[id])は属性(c)として数えられる。
- Specificityは10進数ではなく、もっと大きな基数を基として算出される。(a=0,b=0,c=1,d=0) > (a=0,b=0,c=0,d=11)となる。
CSS2ではstyle属性はID(b)と同等に扱われる。また、擬似要素はSpecificityの算出からは除外される。
