Sassとは

Sass は Less, Stylus, Tass, PCSS などと同様の CSS を拡張したメタ言語のひとつです。

はじめに

冒頭にも記載しましたが、CSSメタ言語の中では比較的に構文がCSSに近く、とっつきやすい印象があります。
その中でも私が使ってききて、これは使えるな！っと思った機能をピックアップしてご紹介いたします。

これインターポートレーションていうんだ。。。
って調べて思いました笑
俗にいう「変数埋め込み」です。
Sassは$・・・の形式で変数を作ることが可能です。
そして定義した変数を埋め込むことで無駄な繰り返しを省くという特性があります。

これは基本中の基本ですね。
ノードの構成の合わせてスコープを小さくできるし、影響範囲の調査も不要になります。
開発効率も上がるし、保守性も高く、可読性も高い！
やらないてはないかと思います！

&で親のセレクタが取得できる。
擬似クラスなどを書く際に用いるととても可読性が上がるし、
スコープの限定もできるのででグレードが発生しにくい。

See the Pen sass convey by Katsunari Yamazaki (@trust-k-yamazaki) on CodePen.

基本スタイルを決めて何度も再利用できるものにするMixin

既に定義済みのスタイルを拡張するExtend

ああ、時間がない、
ここらへんまでで！
次回またこれやります！