2014年7月7日月曜日

Sublime Text 3 + Compass + SCSSでの開発メモ

OSに、RubyとRuby Gemをインストール
Rubyに、GemでCompassとSCSSをインストール
ST3にCompass、SCSSをインストール
プロジェクトにconfig.rbを設置
http_path = "/"
css_dir = "/wp-content/themes/mtef/css"
sass_dir = "/wp-content/themes/mtef/scss"
images_dir = "/wp-content/themes/mtef/images"
output_style = :expanded # :expanded=一般的な{}で改行する形/:compressed=圧縮して出力
line_comments = false
SCSSを作成
/* *****************************
 *
 * Import file to Scss or Sass.
 *
 **************************** */
@import "compass";

a
{
    width:500px;
    overflow:auto;
    @include box-shadow(1px 1px 0 #ccc);
}
SCSSをコンパイルして動作確認
詳細は
http://dev.classmethod.jp/series/scss-tutorial/
とか
http://wp-d.org/2013/01/03/1732/
を見るとよろしい。

0 件のコメント:

コメントを投稿