Visual Studio Code:Emmet記法を使って複数要素を入力する

  • ブックマーク
  • Feedly

複数要素を入力する

<p>タグを3つ入力するには「p*3」と入力すると、

<p></p>
<p></p>
<p></p>

と出力されます。

また、classを指定して「div.item*4」と入力すると、

<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>

と出力されます。

連番を指定して入力する

連番を指定して入力する場合は「$」を使って「div.item$*3」と入力すると、

<div class="item1"></div>
<div class="item2"></div>
<div class="item3"></div>

と出力されます。

なお「$」を複数使って「div.item$$$*3」と入力すると、

<div class="item001"></div>
<div class="item002"></div>
<div class="item003"></div>

と出力されます。

さらに、「@」を使って「div.item$@3*3」と入力すると、

<div class="item3"></div>
<div class="item4"></div>
<div class="item5"></div>

と出力されます。

情報源

書籍

この記事を書いた人

アバター画像

羽沢 仁

業務系システムのエンジニアとして、コンサルティング会社で5年、事業会社の社内SEとして5年、フリーランスとして6年、要求定義、設計、開発、テスト、リリース対応の業務に携わってきました。来年からは、街の○○屋さんと直接つながって、ITツールを提供するサービスを開始します。詳しいプロフィールはこちらをご参照ください。