メモログ

Single Line CSS

プロパティごとに改行いれないでさ、1 行でまとめて書いたほうが見やすいと思うんだよ!という話。理由は、その方が画面の中にたくさんの CSS を表示することができるから。一覧性がとりやすいから作業効率が良いということらしい。

改行とインデントを入れて、奇麗に見やすい(しかし長くなりがちな)CSS を書くか、1 行にまとめて一覧性がとりやすい(しかし見づらい)CSS を書くかは書き手の好みによるとは思います。わたしはどちらかというと、1 行で書くのが好きな方です。特に margin とか padding、line-height、widht、height とか汎用的によく使うプロパティは、ほとんど 1 行で書きます。理由は

  1. 見慣れたプロパティは、見にくくても問題ない
  2. 影響範囲の狭いプロパティは、見にくくても見直すことがあまりない

とかいろいろ。経験に依るところが大きいです。そして徹底しているわけではなくて、本当に気分次第。表記を統一する気があまりない。仕事ではそういうわけにはいかないと思いますけど。

特に最近では、Firebugz の style 情報を見れば、混沌と CSS を記述していても inspect している要素にどんな CSS が適用されているのかが一発でわかる(しかもきちんと整形した状態で表示してくれる)。だから、ますますあまり CSS そのものの見た目を気にしなくなってしまっている。

私について

Yutaka Yamaguchi
東京在住。TypeScript, Node.js, Reactなどフロンエンドが主力。Perlも書く。SwiftやRubyも過去には使ってた。過去のTOEIC 860くらい。