官方文档： https://docs.emmet.io/cheat-sheet/
ctr+shift+p或者直接点击菜单按钮进入package control
image.png
输入install package后等待一会，在弹出的界面输入要安装的包
image.png
image.png
image.png
输入Emmet点击出现的插件，下方状态栏会显示安装状态，安装完成会显示说明文档，文档里有教程怎么使用。
image.png
新建html文件，输入！按tab键
image.png
输入header>nav>ul>li*5>a:link['target'='_blank']{菜单 #$} 按tab键
image.png
header>div#div>ul.class1.class2>li.class_li#id_$*5>a:link[target='_blank' title="title #$" alt="alt #$"]>button[id="button_$" tag="tag_$"]{菜单 #$}
<header>
<div id="div">
<ul class="class1 class2">
<li class="class_li" id="id_1"><a href="http://" target="_blank" title="title #1" alt="alt #1"><button id="button_1" tag="tag_1">菜单 #1</button></a></li>
<li class="class_li" id="id_2"><a href="http://" target="_blank" title="title #2" alt="alt #2"><button id="button_2" tag="tag_2">菜单 #2</button></a></li>
<li class="class_li" id="id_3"><a href="http://" target="_blank" title="title #3" alt="alt #3"><button id="button_3" tag="tag_3">菜单 #3</button></a></li>
<li class="class_li" id="id_4"><a href="http://" target="_blank" title="title #4" alt="alt #4"><button id="button_4" tag="tag_4">菜单 #4</button></a></li>
<li class="class_li" id="id_5"><a href="http://" target="_blank" title="title #5" alt="alt #5"><button id="button_5" tag="tag_5">菜单 #5</button></a></li>
</ul>
</div>
</header>
#content>.article>p.p1[title="p1" alt="p1" style="color:red;font-size:20px"]+p.p2[title='p2'][alt='p2'][style='color:green;font-size:30px']
<div id="content">
<div class="article">
<p class="p1" title="p1" alt="p1" style="color:red;font-size:20px"></p>
<p class="p2" title="p2" alt="p2" style="color:green;font-size:30px"></p>
</div>
</div>
table>(thead>td.col$*4)+(tbody>tr.row$*3>td.col$)+(tfoot>td*5)
注意+的使用要用（）把thead、tbody、tfoot当做一个整体
<table>
<thead>
<td class="col1"></td>
<td class="col2"></td>
<td class="col3"></td>
<td class="col4"></td>
</thead>
<tbody>
<tr class="row1">
<td class="col1"></td>
</tr>
<tr class="row2">
<td class="col2"></td>
</tr>
<tr class="row3">
<td class="col3"></td>
</tr>
</tbody>
<tfoot>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tfoot>
</table>
html>(head>title+style[type='text/css']+(script[src="abc$.js" type="text/javascript"]*3))+(body>(div.content>div.nav>ul>li>a>span)+(div.sidebar>div.top+div.middle+div.bottom)+(div.mian>div.article*3>h1{article$}))+div.footer{copyright}
<html>
<head>
<title></title>
<style type="text/css"></style>
<script src="abc1.js" type="text/javascript"></script>
<script src="abc2.js" type="text/javascript"></script>
<script src="abc3.js" type="text/javascript"></script>
</head>
<body>
<div class="content">
<div class="nav">
<ul>
<li><a href=""><span></span></a></li>
</ul>
</div>
</div>
<div class="sidebar">
<div class="top"></div>
<div class="middle"></div>
<div class="bottom"></div>
</div>
<div class="mian">
<div class="article">
<h1>article1</h1>
</div>
<div class="article">
<h1>article2</h1>
</div>
<div class="article">
<h1>article3</h1>
</div>
</div>
</body>
<div class="footer">copyright</div>
</html>
不指定元素默认div，例如.classname、#idname，id和class属性名不能为关键词
ul>li*10>{$} 正序从1到10
ul>li*10>{$@5} 正序从5开始到14
ul>li*10>{$@-} 倒序从10到1
ul>li*10>{$@-5} 倒序10条，最小为5，就是从14开始到5
a
a:link
<a href=""></a>
<a href="http://"></a>
link
<link rel="stylesheet" href="" />
script
script:src
<script></script>
<script src=""></script>
input <input type="text">
inp <input type="text" name="" id="">
input:p input:password <input type="password" name="" id="">
btn button <button></button>
btn:s button:s button:submit <button type="submit"></button>
btn:r button:r button:reset <button type="reset"></button>
网友评论