Sass/Compassのインデントについて

現状の使い方を列挙。

インデントが深すぎるとむしろ判別つかなくなって効率が落ちるので、

#footer {
  ul {}
  ul li {}
  ul li a {}
} // #footer

上記のように、id, class をラッパー代わりにし、
中の要素はそのまま親子関係を記述するようにしている。

使い始めた頃のインデント例↓

#footer {
  ul {
    li {
      a{}
    }
  }
}

ちょっとわかりづらい。

ちなみに、idの囲み末尾に付いている一行コメントは、
sassのみのコメントで、書き出すcss側では消去されるのでたいへん助かる。

いまのconfig.rb の設定

http_path = "/"
css_dir = "/"
sass_dir = "scss"
output_style = :nested
line_comments = false

ネスト引き継ぎについては検討中で、いまのところexpandedでいいような気もしている。
それからsprite利用なども多用していないので、下記記述なども省いている。

images_dir = "img"
javascripts_dir = "js"

参考

Compassの設定ファイル「config.rb」の編集方法 | 株式会社LIG
http://liginc.co.jp/web/html-css/css/53075

Compass設定ファイル(config.rb)|sass|study|kanapple.net
http://kanapple.net/study/archives/15

あのピンクの書籍が気になっている。

 481 Views