VSCode的emmet输入法

emmet输入法可以快速输入批量的html和css

用法为:标签名+tab     ps:+enter也行但不推荐

标签名.xxx 输入一个class包含xxx的标签,如果标签名省略,则默认为div

如:在vscode中输入:p.c1.c2

效果:

<p class="c1 c2"></p>
标签名#xxx  输入一个id为xxx的标签

如:div#box.c3

效果:

<div id="box" class="c3"></div>
标签名[xx=yy]  输入一个包含xx属性且值为yy的元素

如:img[src=bg.jpg]

效果:ps:因为img本就有src属性,所以效果不是很明显,也可用于自定义属性

<img src="bg.jpg" alt="">
标签名{xxx}  输入一个内容为xxx的标签

如:p{这个标签内容}

<p>这个标签内容</p>
标签a>标签b,输入一个a标签中包含一个子标签b

如:ul>li

<ul>
<li></li>
</ul>
标签名*n,连续输入n个标签
输入多行时,$可以表示序号

如:ul>li{第$$行}*10

<ul>
<li>第01行</li>
<li>第02行</li>
<li>第03行</li>
<li>第04行</li>
<li>第05行</li>
<li>第06行</li>
<li>第07行</li>
<li>第08行</li>
<li>第09行</li>
<li>第10行</li>
</ul>

 

posted @ 2019-06-05 22:56  lan_dou  阅读(446)  评论(0编辑  收藏  举报