divと入力してみる
Visual Studio Codeで「div」と入力すると、次のように変換候補が表示されます。
![Emmet記法:div:変換前](https://i0.wp.com/hx2.jp/wp-content/uploads/2020/10/d43497efa7f9922c6ca7badec41e4abe.jpg?resize=1149%2C279&ssl=1)
候補の右端をクリックすると、次のように何が出力されるか表示されます。
![Emmet記法:div:変換前](https://i0.wp.com/hx2.jp/wp-content/uploads/2020/10/13581110f431a6c1078c6282a1e332c8.jpg?resize=1151%2C269&ssl=1)
<div>|</div>と表示されますが、「|」はカーソルがあたる位置です。
Enterキーを押下すると、次のように<div></div>が出力され、タグの間にカーソルがあたった状態となります。
![Emmet記法:div:入力結果](https://i0.wp.com/hx2.jp/wp-content/uploads/2020/10/d51158e31c388e8ffe70a0c8356f53a4.jpg?resize=1148%2C277&ssl=1)
aと入力してみる
次に「a」と入力すると、次のように表示されます。
![Emmet記法:a](https://i0.wp.com/hx2.jp/wp-content/uploads/2020/10/7d49f23d37f95cfd2635ae137f4fcf25.jpg?resize=1145%2C844&ssl=1)
Enterキーを押下すると、<a href=””></a>が出力されます。
最初の「|」は、出力したときにカーソルがあたる位置を表わし、2番目の「|」は、Tabキーを押下したときにカーソルが移動する位置を表わします。