Emmet記法というのはHTMLやCSSを省略記法で簡単に記述できるという便利な記法。簡単にいうとショートカットキーを打ってEnterするとその場で勝手にコードが展開されるというもの。これでタイプ数の削減が期待できてコーディング時間もかなり削減できるはず。なおVSCodeは初期状態でEmmetが使える。
index.htmlのひな型
まずはよく使う、index.htmlのひな型の例。
「!」と打って…
Enterを押すと…11行分のコードが勝手に展開される。必要に応じてtitle等を書き換えるだけ。
リスト
次にリスト。li要素を５個作りたいとする。
ならば「ul>li*5」と打って…
Enterを押すと…。ul内にli要素が５個生成された。
CSS読み込み
head内でCSSを読み込みたい？
それなら「link:css」と打って…
Enterを押すと…。link rel=””のタグが生成された。あとはcss名を編集するだけ。
scriptの読み込み
body下方でscript（js）を読み込みたい？
それなら「script:src」と打って…
Enterを押すと…。<script src=””>のタグが生成された。あとはファイル名を指定するだけ。
10秒でindex.htmlができあがり。今回はサンプルだけだったけど、もう少し掘り下げて本格的に使ってみるとおもしろそう。
