Web制作者のためのSassの教科書【書籍紹介】Sassの基本から高度な機能まで
書籍について
CSSを書いているときに、「あ~面倒くさい。もっとCSSを効率的に書けたらな~」と思ったことはありませんか?そんなときに読む書籍なら『Web制作者のためのSassの教科書』。
SassとはCSSを記述するための言語(メタ言語)で、そのメリットは効率的なコーディングや記述の簡略化ができ、コードの管理もしやすくなります。そして、コードの内容を変更する際も素早く行うことが出来ます。
Sassの情報はWeb上でもたくさんありますが、書籍『Web制作者のためのSassの教科書』では、Sassの基本から高度な機能まで体系的に学ぶことができオススメです。
Sassのメリット
例えば以下のようなSassの機能はとても便利です。
「変数(Variables)」が使える
「変数」を使用することで、同じ値を複数のプロパティで使用する場合に、再利用ができて便利です。値を変更する場合も、変数に代入された値を変更することで、一度に素早く変更できます。
スタイルの再利用ができる
Sassにある「@mixin」機能では、定義したスタイルを指定した場所で使用でき、スタイルの再利用が可能です。そのため効率的なコーディングや記述の簡略化ができます。コードの内容変更をする際も、定義したスタイルを変更することにより簡単に行えます。
条件分岐・繰り返し処理ができる
プログラミング言語のような、条件分岐(if文)や繰り返し処理(ループ)なども使用できます。ループでは、プロパティが同じスタイルで、値をそれぞれ違う値を指定する場合などで効率的にコーディングできます。
その他にも便利な機能がたくさんあるので、詳しくは書籍を読んでみてください。
※2017/9/15に『Web制作者のためのSassの教科書』の改訂2版が発売されました。内容は大幅刷新されているようです。
書籍の目次
第1章 Sassのキホン
- 1-1 まずはSassって何なのかを知ろう
- 1-2 Sassを導入する前の疑問や不安
- 1-3 何はともあれSassを触ってみよう
第2章 Sassの利用環境を整えよう
- 2-1 Windows環境にSassをインストールする
- 2-2 Mac環境にSassをインストールする
- 2-3 Sassを最新版にアップデートしよう
- 2-4 Sassコマンドの使い方を覚えよう
- 2-5 バッチファイル/シェルスクリプトで簡単にコマンドを実行する
- 2-6 GUI(Koala)でSassを使用する
- 2-7 インストールや実行中にエラーが表示された場合の対処法
第3章 これだけはマスターしたいSassの基本機能
- 3-1 ルールのネスト(Nested Rules)
- 3-2 親セレクタの参照&(アンパサンド)
- 3-3 プロパティのネスト(Nested Properties)
- 3-4 Sassで使えるコメント
- 3-5 変数(Variables)
- 3-6 演算
- 3-7 Sassの@import
第4章 高度な機能を覚えてSassを使いこなそう
- 4-1 スタイルの継承ができる@extend
- 4-2 柔軟なスタイルの定義が可能なミックスイン(@mixin)
- 4-3 制御構文で条件分岐や繰り返し処理を行う
- 4-4 関数を使ってさまざまな処理を実行する
- 4-5 自作関数を定義する@function
- 4-6 テストやデバックで使える@debugと@warn
- 4-7 Sassのデータタイプについて
- 4-8 使いどころに合わせて補完(インターポレーション)してくれる#{}
- 4-9 変数にデフォルト値を割り当てる!default
第5章 現場で使える実践Sassコーディング
- 5-1 管理/運用・設計で使えるコーディングTips
- 5-2 ブラウザ対応で使えるコーディングTips
- 5-3 レイアウト・パーツで使えるコーディングTips
- 5-4 スマホ・マルチデバイスで使えるコーディングTips
第6章 Sassをさらに便利にするCompass
- 6-1 Compassを利用する準備
- 6-2 Compassのインポートとモジュール
- 6-3 Compassのミックスインを使う
- 6-4 Compassの設定変数を定義する
- 6-5 Compassの関数(Helpers)
- 6-6 Compassで簡単CSSスプライト(Compass Sprites)
- 6-7 高度なCSSスプライトの使用方法(Sprite Helpers)
第7章 もっとSassを使いこなして便利にしよう
- 7-1 Sassのフレームワーク紹介
- 7-2 Sassが使えるテキストエディタ
- 7-3 DreamweaverのSassの対応
- 7-4 SassのGUIコンパイラ
- 7-5 SassのCUIツール
第8章 Sass全機能リファレンス
- 8-1 Sassの基本と高度な機能
- 8-2 Sassの関数一覧
- 8-3 Sassの拡張