今回は、私自身が普段VScodeを使っている際に活用している便利な技をご紹介します!
1.HTML5のひな型を入力する方法
上記画像のように「html」と入力すると右下に表示される「html:5」を選択。または、「!」を入力し、右下に表示される「!」を選択することで以下のようにHTML5のひな型を一気に入力することができます。
ちなみに「html lang="ja"」の部分ですが、デフォルトが"en"となっております。
この部分の設定については、「ファイル」>「ユーザー設定」>「設定」
「Emmet.Variables」を検索し、「lang」の部分を「ja」に変更が可能です。
※小文字でも検索可能です
2.classやidを設定した状態で入力する方法
入力したいタグの後ろにclassの場合は「.class名」、idの場合は「#id名」と記載することで、それぞれ名前をつけた状態で入力することができます。
3.入れ子構造で入力する方法
タグ>タグにすることで左側に書いたタグの中に右側のタグを入れ込んだ状態で入力することができます。
4.複数のタグを同時に入力する方法
タグ*nと「n」に入力した数字の数だけ同時に入力することができます。
今回ご紹介したのはVScodeで最初から使うことができる「Emmet」というプラグインを使った省略記法になります。紹介したもの以外にもまだまだありますので、ご興味がある方は是非ご自身で探してみてください。活用することでコーディングの時間を短縮できると思います!