編集:コードをたたむ

Home>Dreamweaver>操作リファレンス>編集:コードをたたむ

この情報はお役に立ちましたか?よろしければ皆様にもお知らせください。

  このエントリーをはてなブックマークに追加 mixiチェック  

コードビューで使います。
HTMLの記述が増えていくと、コードがわかりづらくなります。入れ子にしている要素が増えたりすると、閉じるタグの数が合わなくなったりして、表示がおかしくなる原因になります。

こういうときは、開始タグと終了タグで対になっているとわかっているタグをたたみます。コードの見た目をすっきりさせることで、どこが間違っているのかがわかりやすくなります。

選択範囲をたたむ

選択した範囲のコードを、選択を開始した箇所から、選択を終了した箇所までたたみます。

コードをたたむ

コードをたたむ:コードビューで範囲を指定する

▲コードビューで範囲を指定する

コードをたたむ:選択した範囲がたたまれる

▲選択した範囲がたたまれる

選択範囲以外をたたむ

選択した範囲以外を隠します。

選択範囲以外をたたむ

選択範囲以外をたたむ:コードビューで選択した範囲以外がたたまれる

▲選択した範囲以外のコードがすべてたたまれる

選択範囲を展開

選択範囲に、すでにたたまれたコードがある場合、すべて展開します。

選択範囲を展開

▲複数のたたまれたコードも一度に展開できる

なお、コードビューにおいて、たたまれたコードは、色付けされて表示されます。
その部分を選択すると、行頭に「+」マークが表示され、「+」マークをクリックすると、たたんだコードを展開できます。

たたまれたコードは色付けされて「+」マークが表示される

▲たたまれたコードは色付けされて「+」マークが表示される

「+」マークをクリックするとコードが展開される

▲「+」マークをクリックするとコードが展開される

フルタグをたたむ

カーソルを置いてある場所の開始タグと終了タグまでをたたみます。
範囲選択した状態で「フルタグをたたむ」を実行すると、先頭行にある開始タグとそれに対応する終了タグをたたみます。

行に複数のタグがある場合、カーソルが含まれるタグをたたむ

▲行に複数のタグがある場合、カーソルが含まれるタグをたたむ

402行目、imgタグの内部にカーソルがあったのでimgタグのみたたむ

▲imgタグの内部にカーソルがあったのでimgタグのみたたむ

広範囲を選択した場合、先頭行のタグをたたむ

先頭行のみたたむ

▲広範囲を選択した場合、先頭行のタグをたたむ

選択範囲以外のフルタグをたたむ

選択した範囲の先頭の開始タグから終了タグまでを残して、他のフルタグをたたみます。

選択範囲以外をたたむ、との違い

「選択範囲以外をたたむ」との違いは、「選択範囲以外をたたむ」の場合は、選択した範囲を厳密に残しますが、「選択範囲以外のフルタグをたたむ」の場合は、選択範囲を厳密にたたむのではなく、開始タグから終了タグまでに拡大してたたむことです。

すべて展開

たたまれているコードをすべて広げます。

関連リンク

よく読まれている記事

UpDate:2010-3-6