Compass(コンパス)でSprite画像を自動生成する仕組みはすでにネット上でかなり色々なノウハウが語られてるが、
現在のプロジェクトのディレクトリ構成で、Sprite化する元画像とSprite化した後の画像を別のディレクトリで管理しなくてはならなくなり、
その方法で色々ハマったので、参考にしたURLをとりあえず手当たりしだいに貼っておきます。
何に詰まって、どうやって解決したかは後日まとめる予定。
【とりあえずベーシックな使い方のまとめ】
・Compassで楽々スプライト
http://kanapple.net/study/archives/54
・Sass/Compassを使ってCSSスプライトに挑戦してみました。
http://www.riaxdnp.jp/?p=4015
・続☆Compassでさくっとスプライトを作る方法
http://met.hanatoweb.jp/archives/417/
・簡単に使える Compass のオススメ機能
http://neotag.net/log/2011/12/Less-and-Sass-Advent-calendar-2011-24th.html
・[Sass+Compass]mixin、変数、CSSスプライトなど便利な記述を大公開!
http://cappee.net/coding/scss-compass
【Retina対応とか、手動でカスタムしていくにあたって頼りにしたまとめ】
・Module: Compass::SassExtensions::Functions::Sprites
http://www.rubydoc.info/github/chriseppstein/compass/Compass/SassExtensions/Functions/Sprites#sprite_does_not_have_parent-instance_method
・楽して時間短縮!Compassで作ったスプライト画像でRetina対応を行う方法
http://liginc.co.jp/web/html-css/other-html-css/35502
・CompassでCSS Sprite生成(手動生成、Retina対応)
http://dangerous-animal141.hatenablog.com/entry/2013/03/10/165630
・Compassで複数のSprite画像を扱う
http://webamb.com/compass/890.html
・仕事で使うcompass設定いろいろ
http://www.september-creator.com/2013/05/compass-setting/
【結果、config.rbの設定値とかもいじらなくちゃいけなかったので参考にしたまとめ】
・Compass設定ファイル(config.rb)
http://kanapple.net/study/archives/15
・[Compass] 超訳 Configuration Reference
http://tenderfeel.xsrv.jp/css/compass-css/1235/
【吐き出し先のディレクトリを上手く取得できなかったので色々調査したまとめ(殆ど英語)】
https://groups.google.com/forum/#!topic/compass-users/ZChxlt3gRsw
・Compass v0.12 is Released
http://compass-style.org/blog/2012/02/01/compass-0-12-is-released/
https://github.com/chriseppstein/compass/issues/618
・Compass URL Helpers
http://compass-style.org/reference/compass/helpers/urls/#generated-image-url
0 件のコメント:
コメントを投稿