2015年7月13日のブックマーク (1件)

  • エンジニアはもう一度CSSとちゃんと向き合ってみよう - 詳細度編 - Qiita

    WHAT CSSには詳細度(Specificity)という概念があります. 詳細度は、どのプロパティ値が最もある要素に関係があり、適用されるかをブラウザが決定する手段です。 詳細度 - CSS | MDN 簡単に言うと,「スタイルが重複したとき,どのスタイルを優先するか」の優先度を定量評価したものになります. 詳細度はa, b, cのようなカタチで表されます. 細かい説明するのは面倒なので,ざっくりと以下にリストアップします. 全称セレクタ: a=0, b=0, c=0 * 要素,擬似要素: a=0, b=0, c=1 li, ::before, ::first-line, etc. クラス,擬似クラス,属性: a=0, b=1, c=0 .classname, :first-child, [type=password], etc. id: a=1, b=0, c=0 #idname あと

    エンジニアはもう一度CSSとちゃんと向き合ってみよう - 詳細度編 - Qiita
    bps_tomoya
    bps_tomoya 2015/07/13
    CSS 詳細度をポイント方式で考慮するのではなく、バージョンのように計算すればどちらが優先されるのかが分かりやすい、というお話。