VS Code(Visual Studio Code)で簡単なHTMLやCSSを書いて見た目を確認するときのテクニックを紹介します。
まず、起動して新規ファイルを作成します(起動したら新規ファイルにする設定もありますが、さしあたりctrl+Nで新規作成が可能です。macOSは⌘+N)。
右下のプレーンテキストをクリックし、HTMLに変更します。
言語モードをHTMLに切り替えたら、あとは簡単。html
と入力し、コードスニペットからhtml:5
を選択するだけです。
そうすると以下のようにババッとコードスニペットが入ります。lang="en"
となっていますが、軽くテストする程度なら変更する必要もないでしょう。
基本的なHTMLタグも手打ちするよりスニペットを使った方が圧倒的に早いです。
ctrl+Shift+P(macOSは⌘+Shift+P)を押してコマンドパレットを開き、pre
と入力することでHTMLのサイドプレビューが可能です。