用VSCode加emmet极速创建网页

Emmet是一个缩写扩展插件，VSCode已经内置，所以不用配置了。 其它文本编辑象vim， pycharm也有相应的插件支持。

下图是一个简单的演示，可以感受下它的威力

image

在创建html文件后，输入html:5 按tab键， 就会创建比较完善的html5框架代码

1.png

它还支持类似jquery的选择器语法，输入div.container 就会创建class为container的div

2.png

还可以用ul>li *5 创建有五个li的ul, 尖括号代码下一级， 星号后面加数字则为连续创建n个前面的元素​

3.png

我们再创建一个略复杂的 table>(tr>td{item$5})5 则会创建一个表格有五行，每行有文本item1到item5的单元格, ()为创建独立分组，表示可以做为一个独立元素，这样我们就可以在后面*5去创建5个分组。而大括号为文本信息，就是单元格里的文本

4.png

这些就足以应付我们平时的大部分重复操作了。另外我们还可以用方括号输入属性值，加号创建同级元素，^创建上级元素，具体使用请百度后食用。