[O]Coda2でHTMLとCSSとプレビュー画面を一緒に表示する方法

Title
HTMLとCSSを触る時にはCoda派なOlein編集長(@Olein_jp)です。

いつも調べては忘れてしまう「HTMLとCSSとプレビュー画面を一緒に表示する方法」を、自分用に眼もしておこうと思います。

まずは普通にファイルを開きます

Coda1
まずはHTMLもしくはCSSのどちらかのファイルを開きます。上の画面のような感じですね。

そして、次のファイルを開きやすくするためにサイドバーにファイルブラウザを表示しておきましょう。
Coda2

もう一つのファイルを開きます

次は、先ほどサイドバーに出したファイル一覧からCSSもしくはHTML(先ほどの関連ファイル)を選択して右クリック(もしくはControl+クリック)してメニューを出します。

Coda3
その中に分割ウィンドウで開くをクリックします。すると、先ほど開いたファイルの隣に表示されます。

Coda4

最後にHTMLファイル側からプレビューを表示

最後にHTMLファイルからプレビューを表示させます。

Coda5

すると、この様な画面編成になります。

Coda6

こうすることによって、HTMLを編集してもCSSを編集しても中央に表示されているプレビュー画面にリアルタイムに反映されます。

これって完璧なコーディング環境じゃないっすか?!この環境をフル活用して勉強も進めたいと思います!