前端小白必看！如何高效快速编写html+css代码？emmet语法、快速格式化代码！

在编写代码时，掌握emmet语法是非常有必要的，他可以帮助我们大幅提高编写效率！

1.快速生成html语法

1.1
生成标签，直接输入标签名，然后按tab即可。比如输入“div”，然后按tab，就可以自动生成<div></div>。
1.2
如果想要生成多个标签，用乘号就可以。方法：标签名（shift+8）书写的次数。比如：div*7就可以快速生成7个div标签。
1.3
父子级关系的标签，用>号实现。方法：父级标签>子级标签
比如：ol>li，然后按tab就可以啦。
1.4
类似的，平级关系的标签，用+实现。
1.5
如果要生成带有class的标签，用标签.class名字即可。id标签把.改成#即可。比如：标签#id名字。按照tab键即可。
1.6
如果生成的div类名是有顺序的，用自增幅号--------美金（shift+4）实现：

//输入div.demo$*5,则自动生成：
<div class="demo1"></div>
<div class="demo2"></div>
<div class="demo3"></div>
<div class="demo4"></div>
<div class="demo5"></div>
//不输入div也可以，默认生成div标签。

2.快速生成css语法

css用简写形式，输入每个单词的首字母，即可生成你要的属性。
比如输入w200，按tab之后，生成width:200px;
lh26,按tab之后，生成line_height:26px;

3.快速格式化代码

很多支持前端开发的软件都可以快速格式化代码，它可以自动排版好写的很乱的页面。
vscode快速格式化代码：shift+alt+f，或者点击右键，选择快速格式化代码按钮。
不过，我们还可以让vscode保存页面的时候自动格式化代码：
选择“文件”------“首选项”-------“设置”
搜索emmet.include;
在setting.json下的“用户”中添加以下语句：
“editor.formatOnSave”:true,
“editor.formatOnSave”:true
这样就完成了。
只需要设置一次就可以了。以后都会自动保存格式化代码。