Emmet语法
概述：Emmet语法已被集成到vs code中了，可直接使用。对于提高效率有极大作用。
生成HTML
标签名点击Tab补充生成
$自增符
{}加内容
>父子关系
+兄弟关系
表达式之间无空格
表达式：标签名./#属性名${内容$}*个数
举例:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>emmet语法学习</title>
<style>
.class0 {
color: red;
}
#id0 {
color: yellow;
}
</style>
</head>
<body>
<div></div>
<!-- div -->
<div></div>
<p></p>
<!-- div+p -->
<ul>
<li></li>
</ul>
<!-- ul>li -->
<p>gaoyang</p>
<!-- p{gaoyang} -->
<p>gaoyang1</p>
<p>gaoyang2</p>
<p>gaoyang3</p>
<p>gaoyang4</p>
<p>gaoyang5</p>
<!-- p{gaoyang$}*5 -->
<p class="class0"></p>
<!-- p.class0 -->
<p id="id0">1111111</p>
<p class="class0">0000000</p>
</body>
</html>
生成css
简写·加tab
W200
H5
Text-indent2
举例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>emmet语法学习css</title>
<style>
body {
width: 200px;
font-size: 50px;
height: 100px;
}
</style>
</head>
<body>
100
</body>
</html>
格式化（快速工整文档）
自动格式化
自动格式化设置步骤（保存文档时自动格式化）：（部分版本失效）
文档-首选项-emmet.Include-用户-添加”editor.formatOnSave”:true和”editor.formatOnType”:true
左下角- emmet.Include-用户-添加”editor.formatOnSave”:true和”editor.formatOnType”:true
手动格式化
a) 右键，格式化
b) Shift alt f（快捷键）