CSSを記述する際フォーマットルールを作る

|

CSSを記述する際、余白やインデントに関して、自分なりあるいは複数で管理する場合はプロジェクト単位でルールを決めておくと、見やすさ(可読性)が向上します。

ちなみに私の書き方は以下のとおりです。

CSSコード

selecter {
   property:value;
}
  1. selecter名と「{」の間に半角スペースを空ける
  2. propertyの前に半角3文字分スペースを空ける
  3. propertyおよびvalueと「:」の間にはスペースを空けない
  4. valueと「;」の間にはスペースを空けない
  5. propertyがひとつしかない場合でも、必ずvalueの後に「;」はつける

基本的にスペースは付け忘れが多いため、空けないようにしているのですが、selecterの後には必ずスペースを入れるようにしています。これは、CSSファイル内でselecterを検索する際、スペースを空けておくと便利なことが多いからです。

最近のブログ記事