Visual Studio Code关于写html的快捷键

Visual Studio Code关于写html的快捷键

这几天写html，找别人学了一些有趣的快捷键，作用不一定很大，但还是记录一下。

多个平级标签

输入 div*5 会有提示，按回车，出现下面的代码
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>

多个平级排序标签

输入 div{$}*4 出现提示后，按回车，出现下面的代码
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>

给标签加id和class

输入 div#tagId 提示，回车
<div id="tagId"></div>

输入 div.tagClass 提示，回车
<div class="tagClass"></div>

多层嵌套标签

多层嵌套标签用>右尖括号，还可以任意组合。

span>div>section
<span>
    <div>
        <section></section>
    </div>
</span>

span>div*3>section
<span>
    <div>
        <section></section>
    </div>
    <div>
        <section></section>
    </div>
    <div>
        <section></section>
    </div>
</span>

span>div{$}*3>section
<span>
    <div>
        1
        <section></section>
    </div>
    <div>
        2
        <section></section>
    </div>
    <div>
        3
        <section></section>
    </div>
</span>

span>div*3>section{$}*3
<span>
    <div>
        <section>1</section>
        <section>2</section>
        <section>3</section>
    </div>
    <div>
        <section>1</section>
        <section>2</section>
        <section>3</section>
    </div>
    <div>
        <section>1</section>
        <section>2</section>
        <section>3</section>
    </div>
</span>