CSS プロパティの書き順

今回のテーマは、「CSSのプロパティを記載する順番」についてです。

順番についていくつかのやり方がありますが、今回は「mozilla.org Base Styles」をもとに記載順については、解説します。

順番を暗記しておけば、CSSについての知識が十分でなくても、下記の5つの大枠を覚えていれば
何を指定しないといけないか考える習慣がつくと思います。
私は、これを知った時、各プロパティの意味よりもこの順番を覚えておけば、各プロパティを学習するときにスムーズに頭に入ったのではないかと思います。

CSS プロパティの順番

1.視覚整形モデル
　～要素を表示するか？要素をどこに表示するか　

2.ボックスモデル　

～ボックスモデルの大きさや間隔は？

3.背景　～　背景は？

4.フォント、テキスト、色

5.その他

まとめ

書き順についてですが、Mozilla以外にもgoogle推奨の書き順等、ほかにもあります。

書き順が自分以外の誰かが見た時に見やすくなります。
チームで仕事をするときは、こういったルールを決めてコーディングしたほうがよいと思います。