HTNL标签快捷键

alt+b 快速进入网页（vscode下载完open in broswer插件后）
shift+alt+鼠标点击多行快速编辑
shift+3 快速加# （可快速加标签id名）
ctrl+/ 快速注释

直接编写标签名然后回车可快速生成标签
如：p（回车）-->

生成多个标签

p*3(回车) -->

生成嵌套标签

b>i>p -->

同级嵌套标签

(p+br)*2 -->

如果想要上级，就加^{，需要向上多少级就加多少}

div.nav>ul>li^span

</ul>

</div>

标签名[标签属性]{文本内容}

p[class="jjj"]{你好吗}

输出:

<p class="jjj">你好吗</p>

生成超链接一般要加上可点击的文本内容:

a{click me}>b ---> <a href="">click me</a>

a>{click me}b ---> <a href="">click me</a>

a>b{click me} ---> <a href=""></a>{click me}

生成制定id为jjj的p标签

p#jjj

输出：

生成制定类（此处类名为ttt）的p标签

p.ttt

输出：

生成类名为ttt和且id为jjj的p标签

p#jjj.ttt

输出：

$例如无序列表，我想为五个个 li 增加一个 class 属性值 item1 ，然后依次递增从 1-5，那么就需要使用$ 符号：

ul>li.jjj$*5
结果是：<ul>
<li class="jjj1"></li>
<li class="jjj2"></li>
<li class="jjj3"></li>
<li class="jjj4"></li>
<li class="jjj5"></li>
</ul>

$表示一位数字，只出现一个的话，就从 1 开始，如果出现多个，就从 0 开始。如果我想生成三位数的序号，那么要写三个$ ：

ul>li.jjj$$$*5
1
输出：

此外，也可以在 $ 后面增加 @- 来实现倒序排列：

ul>li.jjj$@-*5
1
输出：

同时，还可以使用 @N 指定开始的序号：

ul>li.jjj$@3*5
1
那么输出：

<ul>
<li class="jjj3"></li>
<li class="jjj4"></li>
<li class="jjj5"></li>
<li class="jjj6"></li>
<li class="jjj7"></li>
</ul>
配合上面倒序输出，可以这样写：

ul>li.jjj$@-3*5
就可以生成以 3 为底倒序列表：