Schooをご利用になるには、JavaScriptの設定を有効にしてください。 →JavaScriptの設定方法（参考）

SublimeText入門

PREMIUM

第6回

Sublime Text+Sassで爆速コーディング【プラグイン編】

2015年2月21日 60min

Sublime Text+Sassで爆速コーディング【プラグイン編】

play_arrow おためし受講

スライド資料

会員登録して、全てのスライドを見よう

1 / 30

授業の概要

SassはJavaScriptのように関数を使って様々な処理を実行したり変数を使用する事ができます。変数を使用する事によって、1回の記述で数カ所のスタイルを指定する事ができます。また、条件分岐や繰り返し処理を行う事でページによって背景画像を変えたり、フォントサイズによって色を振り分けたりする事ができます。SublimeTextにSass用プラグインを導入して、プログラミング的な指定を楽々こなす手法を学びます。

※Subulime Textがインストールされている事を前提に授業が進んでいきます。

1）Sublimeのインストール

下記のURLからダウンロードしてください。
http://www.sublimetext.com/2

2) Sublimeの設定

下記の授業を見て、必要な設定をしておく事をお勧めします。
・マルチデバイス対応コーディングのためのSublimeText【環境整備編】

3) 以下の授業を受講するとより理解が深まります。

・コーディング時間を1/3にするSublimeTextだからできるemmet連動
・SublimeTextだからできるFTP連動と正しいディレクトリ管理

こんな人にオススメ

Sassを使用したcssのコーディング方法を学びたい方

担当の先生／パーソナリティ

チャプター

自己紹介＆アジェンダ

そもそもSassっを使うとどういういいことがあるの？

SassもLessの違い

今回の授業の為の環境整備確認

scssを使いやすくするプラグイン

前回のおさらい

scssプラグインで@mixinコードを配置しよう

Sass変数を使おう

変数使用のルール：使える文字・使えない文字

Ｑ：Sassやlessの両方とも把握していないと難しいでしょうか？

Ｑ：@include btnの上とか下に、@mixinと同じ属性を書いた場合、どっちが優先されますか？

Ｑ：Sass is watching for changes.で、変更が反映されるタイミングは?

Ｑ：別ファイルに、今まで作った自作mixinのライブラリを用意しておきたいんですが、できますか？

Ｑ：mixinに引数かなにかで、値を渡すことはできるんでしょうか？