lessって？
CSSの保守性を向上させるライブラリ。これを使うことでcssが圧倒的に便利になる。
スコープが使える
階層を作ることで他の部分への影響を抑えることができる。これはかなり大きい。
変数が使える
特によく使う色を変数化したり、サイズなどを変数にしておける。またちょっとした計算もできる。
関数化
主にCSS3でのboxshadowなどを関数化しておき、変数を与えることで記述量を大幅に減らせ、保守性を向上できる。
インポート
インポートなどを使うことで部品化ができる
例えば定数系、ヘッダー系、各自のCSS系
インストール
rubyかnodeがインストールされていることが大前提。
ruby(正確にはgemまでインストールしていないとダメ)
|
1 |
gem install less |
node
|
1 |
npm install -g less |
どちらかというとnodeが一般的なようです。
ちなみにwindowsだとless.js-windowsというソフトがあると楽です。これ一発で済みます。
コンパイル
|
1 |
lessc コンパイルしたいlessファイル > 生成したいcssファイル |
実際にはエディタやIDE、gulpなどで保存した瞬間にコンパイルするようにするほうが望ましい。
