chevron_left SublimeText入門

SublimeText入門

PREMIUM

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

1 / 40

授業の概要

cssはネストの構造を記述する事ができないため、うまく優先順位を考慮しなければ指定できなかったり、後で書いた記述に上書きされてしまったりします。CSSプリプロセッサ(CSS拡張メタ言語)を使えばhtmlのネスト構造のままスタイルを設定できるようになります。大規模なサイトになるほどネストの階層は深まって行きますが、そのままの構造でスタイルが当てられるのでセレクタが被る事がありません。また、ナビボタンに一つづつ違う画像を指定するなどの連番のクラス名をつける、4〜5個のベンダープレフィックスをつけるなどを、一発指定するという神業をやってのけます。

この授業はCSSプリプロセッサSassをSublimeTextに導入して操作する方法を学びます。


CSSプリプロセッサにはBootstrapで採用されているLessなどがありますが、Sassはcssに近いScss記法で親しみやすいため、最もユーザー数の多いCSSプリプロセッサです。
Rubyをインストールする必要があります。MacはRubyが標準装備されています。Windowsの方は、下記のサイトを参照にしてRubyのインストールをしてください。
http://www.rubylife.jp/install/install/index1.html

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

1)Sublimeのインストール

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

2) Sublimeの設定

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

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

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

こんな人にオススメ

本格的なフロントエンド開発環境を学びたいコーダー志望の方