あいさつ

今回は、Web開発をしていてデザインについても開発ルールがあるのか興味があり調べてみました。
開発者は、普段のプログラムは効率化、共通化を考えるがデザイン（css）にもその概念があるのでしょうか？
結論は、スコープ(scope)という概念があり、分かりそうで分からなかったのでまとめてみましたよ。
その範囲だけデザイン反映を限定することが「スコープ」ということらしい。

CSSの優先度

cssには、スタイル(style)の優先度が存在するのでその優先度を意識しながらデザインするといいらしい。

以上の表の点数の合計値でどのスタイルが優先されるか決まるらしい。

※同じ合計値になった場合、cssの記述はあと勝ちになってしまう。

!importantの宣言

cssの優先度を紹介しましたが、それらを無視してスタイルを強制する方法として!importantが存在している。
!importantを乱用しすぎると、!importantでしかデザインできなくなってしまうため、よほどのことがない限り使わない方がいいらしい。
いろんな所で、!importantが使われているので使って良い境界線が曖昧な印象でした。

まとめ

cssの優先度を意識して、デザインをしていくと他の要素に影響を与えずスタイルを変更していけると言える。

また、!importantとstyle(要素に直書き)はcssの優先度が高いため記述を控えたほうがいいとも言えそうです。