HTML / CSS

【超簡単】VSCodeでHTML5の雛形(headの部分)を一瞬で生成する方法

こんにちは、アプリ開発者のTERUです!

「head要素に何を書けばいいの?」「HTMLをもっと効率的にコーディングにしたい。」とお悩みではないでしょうか?

テル

本記事ではそんな悩みを解決していきます!

HTML5の雛形を生成する手順

  1. htmlファイル用意し、VSCodeに読み込む。
  2. !(ビックリマーク)を入力して Tab 押す。
  3. html lang=”en”を”ja”に書き換える。

たったこれだけです。すごく便利です。

私もこれを知った時「こんな便利な方法があったのか!」と思いました。(笑)

これはVSCodeに標準搭載されているEmmetという機能が働いています。

他のエディターでは面倒な導入作業をしなければいけないのですが、VSCodeはこのような便利な機能が標準搭載されています。

このEmmetを使った便利なコーディング方法がたくさんあります。

公式が用意しているEmmetのチートシートがあるので参照して見てください。

Emmet チートシート 

https://docs.emmet.io/cheat-sheet/

Emmetをマスターして、効率的なHTMLコーディングを身につけていきましょう!

最後までご覧いただきありがとうございました。ではまた!

エンジニア就活対策