他人の書いたCSSのソースを見ると、わかりづらいことがあります。というのは、CSSの癖が僕にもついているし、他人にもついているってことです。

CSSのプロパティの順番は決まっていないので、一人で書くとなるとカオスになることが多いです。こういうときに、厳密に書けるとすごく楽だなぁ〜と思ってしまいます。そこで、あれこれ調べてみたら、web creatorsにそれっぽい記事が。

Mozilla.orgでプロパティの順序を提案しているようです。英語記事だったので、僕はそそくさと逃げました(笑)。そして、同じ雑誌にその順序が載っていたのでメモも兼ねて書いておきます。

  • display
  • list-style
  • position
  • float
  • clear
  • width
  • height
  • margin
  • padding
  • border
  • background
  • color
  • font
  • text-decoration
  • text-align
  • vertical-align
  • white-space
  • other text
  • content

どんな順序で並んでるかというのを見ていくと、大体表示するか、しないかというところから後になるにつれ、装飾プロパティに近づいています。やっぱり「表示する・しない」を最初に出しておいたほうが、目に付きやすいですからね。

しばらく、これを参考にやってみようと思います。