使用するエディタは Visual Studio Code です。
拡張機能は emmetを使用します。
まず、基本となる型を書きます。
ひとつ前の記事でも書いたように 「！」＋tabキーです
<!DOCTYPE html>
<html lang=“ja”>
<head>
<meta charset=“UTF-8”>
<title>Document</title>
</head>
<body>
</body>
</html>
はい、この形が作られました。
そして、リストやテーブルって
項目が少しなら書けますが、多いとコピー＆ペーストでもとても手間ですよね・・・
Emmetという拡張機能を入れれば簡単にパッと出すことが可能です。
<!DOCTYPE html>
<html lang=“ja”>
<head>
<meta charset=“UTF-8”>
<title>Document</title>
</head>
<body>
table>tr>th+td
</body>
</html>
このように bodyの中に
table > tr > th + td
と記述して tabを押します。
<table>
<tr>
<th></th>
<td></td>
</tr>
</table>
するとbodyの中に一瞬で テーブルが作られました。
便利です。。。
<!DOCTYPE html>
<html lang=“ja”>
<head>
<meta charset=“UTF-8”>
<title>Document</title>
</head>
<body>
ol>li*3
</body>
</html>
次に、リストを作ります。
これを入力してtabを押すと
<body>
<ol>
<li></li>
<li></li>
<li></li>
</ol>
</body>
うわあああお！ すごい 出来上がりました。
ちなみに
<body>
ol>li
</body>
だけの記述だと
<body>
<ol>
<li></li>
</ol>
</body>
こうなります。
つまり
外側 > 中側 というわけです。
そして ＊（欲しい数）をしてその分を表示します。
いやーすごい機能です
ありがとうございました。
コメント