Phize on the Web

カスケーディング順序とSpecificity - CSS

カスケーディングの順序

CSSでは、宣言は次の優先順位でカスケーディングされる。

  1. スタイルシートの種類と!importantキーワードの有無
    1. UAのデフォルトスタイルシート
    2. ユーザスタイルシート
    3. 作者スタイルシート
    4. 作者スタイルシート(!importantキーワードあり)
    5. ユーザスタイルシート(!importantキーワードあり)
  2. セレクタのSpecificity
  3. スタイルシートの読み込み順・宣言の記述順

セレクタのSpecificity

セレクタのSpecificityは、次の規則に基づいて算出された値、a,b,c,dを左から並べたものとなる。

  1. style属性に記述されている場合はa=1、それ以外はa=0とする。
  2. セレクタに含まれるIDの数をbとする。
  3. セレクタに含まれる属性と擬似クラスの数をcとする。
  4. セレクタに含まれる要素型名と擬似要素の数を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の算出からは除外される。

Copyright© 2006-2017 Phize on the Web All Rights Reserved.