ga-04-18

HTML/CSS初心者の為の
無料で挫折させない ホームページ作成講座

18.Sublime Textの使い方

目   次

1.Sublime Textの文字色の変更

2.Sublime Textの良く使うショートカット

3.Sublime Textの便利な機能



  1.Sublime Textの文字色の変更

Sublime Textをインストールすると最初に出てくる画面には、強烈な色彩の文字が出てきます。それは良いのですが、コメントの色が薄いグレーで見づらいので変更することをお勧めします。

【インストールした時の文字色】

画像

【基本設定 - color scheme を選択】

画像

【mariana を選択】

画像

【文字色を変更した画面】

画像

  
  2.Sublime Textの良く使うショートカット 

画像
画像

画像
画像

  
  3.Sublime Textの便利な機能

A.閉じタグのチェック機能

画像

タグにカーソルを合わせると対のタグがある場合は、両方のタグに薄い赤線が引かれます。この機能を使ってタグが閉じられているかをチェックできます。

B.対となる閉じタグをセットする機能

画像

閉じタグが必要な個所で「</」を入力するとSublime Textが適切な閉じタグを選択してセットします。自分で入力すると間違う場合があるので閉じタグのセットはSublime Textに任せましょう。但し、直前に<br>があると</br>をセットするので、この場合は自分で適切な閉じタグをセットしてください。

C.文字色によって文法をチェックする機能

画像

閉じ「 }」、セミコロン、コロンなどを忘れた時に文字の色が正しく変わらないことで文法エラーを発見できます。

Ⅾ.property候補、タグ候補を表示する機能

画像

propertyの頭1桁又は数桁を入力することによって property候補一覧表が表示されます。タグ候補も同様に表示されます。propertyのスペルを間違うこともないし、propertyのスペルを覚える必要もありません。

E.コメントアウトを使ってデバッグをする機能

画像

範囲選択をして、「ctrl+/」を押下すれば、選択範囲がコメントとして扱われます。コメントアウトされた範囲の1ヶ所にカーソルを置いて「ctrl+/」を押下すれば、コメントアウトが解除されます。この機能を利用して、結果が思ったようにならなかった時に原因調査の目的で使用できます。かなり役に立ちます。

 back
pagetop

思った結果が
出なかった時の
対処法

Sublime Textの使い方

Copyright (c) 無料で挫折させないホームページ作成講座 All Rights Reserved.
by yorozuken