emmetが超便利 |
Emmetとは、HTMLとCSS の省略記法です。効率よく記述することができます。 VSCodeに標準で実装されています。
エクスクラメーションマークの後でtabキーを押すとHTMLのひな形ができます。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> </body> </html> emmetの使い方は簡単です。 タグの中身だけ br tabキー その結果: <br> に変換されます。 タグの <>をタイプしないだけ随分楽になった気がします。例えばaタグ <a href="abc.html">新しいページへ</a> このような記述をしたいときは、 aとタブキーで、 <a href=""></a> のひな形ができるのであとはリンク先と説明を書くだけです。楽になります。同様にimgタグは、 imgとタブキー <img src="" alt=""> 画像の場所とコメントを書くだけです。 ulタグは、次のように記述すればあとは中身をいれるだけです。 ul>uiとタブキー
更にli要素に<a href=""></a>を加えたいときは、ul>li>a[href=#]とタブキー
タブキーを使うと省略入力が簡単にできる |