Sassを勉強する

  • Pocket
  • このエントリーをはてなブックマークに追加
  • 162 follow us in feedly

Sassって?
CSSをプログラム制御を用いて書く事ができるみたい。
.sass .scss とあるが.sassは古く.scssが主流みたい。
今回も.scssを使って勉強する

開発環境を整える
SASSはgemのパッケージらしい。
よーするにRubyが必要ってこと。
gemを使えるようになるところまでは今回は割愛
では、実際にインストール

# gem install sass

sassのコマンド
.scss から .cssを作成する為のコマンド
# sass –style expanded sass/main.scss:css/main.css
※このオプションを指定しないと勝手にインデントをつけるので気持ち悪い。。

.scssを更新すると自動で.cssを生成してくれる便利なコマンド
# sass –style expanded –watch sass/:css/
watchのごとく常に見張ってくれてるのね。。

てな感じで入門サイト一周した結果を最後に
https://github.com/keitarou/sass_test

ちょっとこれからjsやcssはたまたZencodingとか便利な技術の勉強していこうかな。

おすすめ書籍

Web制作者のためのSassの教科書 これからのWebデザインの現場で必須のCSSメタ言語
平澤 隆 森田 壮
インプレスジャパン
売り上げランキング: 6,929
Sass入門 ~より効率的なCSSコーディング
技術評論社 (2013-11-11)
売り上げランキング: 32,775

関連記事

images-2

1000DL記念!?ポケモン図鑑gemをアップデートしました

まえがき 以前公開した、ポケモン図鑑Gemライブラリ『pokemon...

記事を読む

Screeny Shot 2013-05-26 19.03.18.png

railsでFlatUIを使ってみるの巻

  まえがき 話題のcssテーマ「FlatUI」を使いたく、どうせなら...

記事を読む

RubyGemライブラリ「Mechanize」で遊んでみる

まえがき Webサイトのスクレイピング処理などで使える、RubyGem...

記事を読む

CSSBeautifyをコマンドラインで使ってCSSを綺麗にする。

まえがき CSSを整形するためのWEBツール『CSSBeautify』...

記事を読む

better-errorsbetter-errors.png

Railsのエラーデバッグ画面をリッチにしてくれる『Better Errors』

まえがき RoRでエラーのデバッグ画面をリッチにしてくれるライブラリ...

記事を読む

新着記事

no image

PHPでRubyのirbっぽいインタラクティブなスクリプトが実行できる「boris」

まえがき PHPでもRubyのirbみたいなことがしたくて探してみたと...

記事を読む

2015年の抱負と去年の振り返り〜よちよちWEB業界1年経験して〜

まえがき あけましておめでとうございます。今年もどうぞよろしくお願いし...

記事を読む

Java SE 7 Bronze試験(1Z0-802)を受けてきました

まえがき 以前から少し受けてみたかった試験『Java SE 7 Bro...

記事を読む

HubotでJenkinsのジョブを実行する

まえがき HubotをつかってJenkinsのジョブをじっこうしてみた...

記事を読む

no image

Hubotをforeverでデーモン化する

まえがき 今回はHubotをforeverを使ってデーモン化してみた時...

記事を読む

スポンサーリンク

  • Sorry. No data so far.

PAGE TOP ↑