CSSの適用優先順位

NO IMAGE

cssには優先順位があり、適用されない!!ってことが結構あります。

改めて、順位をまとめてみた。

1.誰が指定したスタイルか

これはm!importantで指定された制作者が優先される。

こんなの指定したこと無いけど

2.スタイル指定範囲の限度具合

スタイルの優先順位は「個別性(specificity)」により決定される

①style属性がある場合は1をカウント(=a)

②セレクタに含まれているid属性の数をカウント(=b)

③セレクタに含まれているid以外の属性と擬似クラスの数をカウント(=c)

④セレクタに含まれている要素、五時要素の数をカウント(=d)

より局所的に指定されたスタイルほど優先される

つまり、

li より ul li より ul li.sample より ul ol li.test より ul ol#sample より style=”~”

3.スタイルが読み込まれた順序

最終的にブラウザに最後に読み込まれたスタイルが適用される。

同一css内であれば、後に記述されたもの。

CSS+htmlカテゴリの最新記事