ショートカットの設定

環境設定は「編集＞環境設定」

Mac：Command + U
Windows：Ctrl + U

キーボードショートカットは「編集＞キーボードショートカット」で編集が可能です。

 

インデントの設定

インデント
Mac：Command + Shift + >　or　Command + Opt + ] Windows：Ctrl + Shift + >　or　Ctrl+Alt + ]

インデント解除
Mac：Command+Shift + <　or　Command + Opt + [
Windows：Ctrl + Shift + <　or　Ctrl + Alt + [

 

インデントは「編集＞環境設定＞コードフォーマット」で変更することが出来ます。

 

 

Emmetの省略記法

Emmetとは、HTMLをより素早く編集できるプラグインで、Dreamweaverにはデフォルトで搭載されています。

例えば、

div#page>div.logo+ul#navigation>li*5>a

と打ったあとにtabキーを押して生成されるhtmlは以下のようになります。

section.mainarea>div.flex>div.width50*2>img.thumbnail

 

CSSのクラス付けをするような形で書いたあと、ぽんとtabキーを押すだけでHTMLが生成されます。
さらに、CSSも同じように生成が可能です。

行一つ一つにtabを打っていくことで生成されます。

ベンダープレフィックスも全部つきます。ありがたいのかそうでないのか。

Emmetはこちら。

チートシートはこちら。

複数カーソル処理と非連続選択の複数カーソル処理

「Alt+ドラッグ」でカーソルが増えます。これに同じ処理が可能です。
動画です。

「Ctrl+クリック」で離れたところも選択できます。
こちらも動画。

 

複製

行にカーソルを合わせて「Ctrl + D」で複製が可能。これはイラレでもおんなじですね。
動画ですよー。

 

指定する行への移動

「Ctrl + G」で行が指定できます。たくさん書いてあるとき便利ですね。

 

コメントとコメントアウト

「Ctrl + /」でコメントアウトが出来ます。

テンキーがある人はテンキー箇所が便利。ない人は「め」のところ。「効かないなー」という場合は「Ctrl + shift + /」も試してみましょう。

 

検索する、置き換えする

「Ctrl + F」でファイル内の検索ができます。
ローカルにファイルが存在する場合、「Ctrl + shift + F」でファイルを横断した検索/置き換えが可能です。
（メニューの「検索」からでもできます）

 

少しずつ覚えながら使っていくと、コーディングがもっと早くなっていきます。頑張って覚えましょう！