リスト要素などで連番付の文字を入力する場面がよくありますよね。コーディングを高速化するマークアップツールEmmetを使えば一瞬で入力が可能です。

まずは下記の様にスペニットを入力しショートカットキーを押します。{}の中身はli要素に囲まれた文字で、$が連番となります。

1
ul>li{ダミーテキスト$}*10

下記の様にソースコードが展開されます。

1
2
3
4
5
6
7
8
9
10
11
12
<ul>
    <li>ダミーテキスト1</li>
    <li>ダミーテキスト2</li>
    <li>ダミーテキスト3</li>
    <li>ダミーテキスト4</li>
    <li>ダミーテキスト5</li>
    <li>ダミーテキスト6</li>
    <li>ダミーテキスト7</li>
    <li>ダミーテキスト8</li>
    <li>ダミーテキスト9</li>
    <li>ダミーテキスト10</li>
</ul>

記事投稿者:森近 将史(もりちか まさし)