画像をCompass(Sass)でData URIスキーム化してHTTPリクエストを削減する そもそも「Data URI」って何?って話ですが、例えば下記の画像。 実はスマホでGmailを表示した際に使われているアイコン画像なのですが、画像のリンクを開いたURLを見てください。外部に存在する画像を参照しているので… ゴトーハック2014.03.20 919
ベンダープレフィックスが面倒な人に贈る、常用Compass(Sass)ミックスイン 「-webkit-」「-moz-」といったベンダープレフィックス付きで複数書かなければならないCSSプロパティは面倒ですよね。Compassミックスイン使って楽しましょう。 @include border-radius(… ゴトーハック2014.03.20 570
Gruntの使い方:CompassでCSSスプライトを自動生成する 実はGruntは関係なくてCompass単体の機能なのですが、前々回GruntでCompassを自動処理できるようにしたので、scssファイルに記述を追加するだけでCSSスプライトを自動生成できます。 下記のフォルダ構成… ゴトーハック2013.12.19 347
Gruntの使い方:Compassをコンパイルする 前回Sassのコンパイルを行いましたが、Compassのコンパイルはまた別のタスクになります。 下記のフォルダ構成を前提とします。 project ├css ├sass ├config.rb (compass用設定ファイ… ゴトーハック2013.12.18 253
WindowsでCompassをコンパイルした時の「Windows-31J」問題 WindowsでCompassを使ってSassをコンパイルした時、文字コードに「Windows-31J」という見慣れない文字コードが勝手に設定されます。 CompassはRubyで動いているわけですが、WindowsのR… ゴトーハック2013.12.04 489