emmet语法
1.1 生成html初始文档
!+tab或者html:5 生成html5文档的初始结构
html:xt 生成html4过渡型
html:4s 生成html4严格型）生成的文档如下：
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Documenttitle>
head>
<body>
body>
html>1.2 生成带有id,class的HTML标签
1.
#aaa 生成一个ID为aaa的div生成结构如下：
<div id="aaa">div>2.
ul#ccc.ddd 生成一个ID为ccc,class为ddd的ul生成结构如下：
<ul id="ccc" class="ddd">ul>1.3 生成后代 “>”
div.aaa>ul>li 生成一个无序列表，而且被class为aaa的div包裹生成结构如下：
<div class="aaa">
<ul>
<li>li>
ul>
div>1.4 生成兄弟
div+p+dp<div>div>
<p>p>
<dp>dp>1.5 生成上级元素 “^”
上级 （Climb-up）元素是什么意思呢？前面咱们说过了生成下级元素的符号“>”，当使用 div>ul>li 的指令之后，再继续写下去，那么后续内容都是在 li 下级的。如果我想编写一个跟 ul 平级的 span 标签，那么我需要先用 “^” 提升一下层次。例如：
div>ul>li^span<div>
<ul>
<li>li>
ul>
<span>span>
div>如果我想生成一个与div平级的span，那么就再上升一个层级，多用一个^
div>ul>li^^span<div>
<ul>
<li>li>
ul>
div>
<span>span>1.6重复生成多份*
ul>li*5<ul>
<li>li>
<li>li>
<li>li>
<li>li>
<li>li>
ul>1.7生成分组()
div>(header>ul>li*2>a)+footer>p<div>div>
<header>
<ul>
<li><a href="">a>li>
<li><a href="">a>li>
ul>
header>
<footer>
<p>p>
footer>分组还可以结合上面的*符号生成重复结构
(div>dl>(dt>dd)*3)+footer>p<div>
<dl>
<dt>
<dd>dd>
dt>
<dt>
<dd>dd>
dt>
<dt>
<dd>dd>
dt>
dl>
div>
<footer>
<p>p>
footer>1.8生成自定义属性[attr]
a 标签中往往需要附带 href 属性和 title 属性，如果我们想生成一个 href 为 “http://google.com” ，title 为“我爱水煮鱼”的 a 标签，可以这样写：
a[href="www.google.com" title="我爱水煮鱼"]<a href="www.google.com" title="我爱水煮鱼">a>1.9生成内容编号$
ul>li.item$*5<ul>
<li class="item1">li>
<li class="item2">li>
<li class="item3">li>
<li class="item4">li>
<li class="item5">li>
ul>就表示一位数字，只出现一个的话，就从1开始。如果出现多个，就从0开始。如果我想生成三位数的序号，那么要写三个
ul>li.item$$$*5<ul>
<li class="item001">li>
<li class="item002">li>
<li class="item003">li>
<li class="item004">li>
<li class="item005">li>
ul>只能这样单调的生成序号？对于强大的 Emmet 来说，肯定不会会了，我们也可以在 $ 后面增加 @- 来实现倒序排列：
ul>li.item$@-*5<ul>
<li class="item5">li>
<li class="item4">li>
<li class="item3">li>
<li class="item2">li>
<li class="item1">li>
ul>我们也可以使用@N指定开始的序号
ul>li.item$@3*5
<ul>
<li class="item3">li>
<li class="item4">li>
<li class="item5">li>
<li class="item6">li>
<li class="item7">li>
ul>配合上面倒序输出，可以这样写:
ul>li.item$@-3*5
<ul>
<li class="item7">li>
<li class="item6">li>
<li class="item5">li>
<li class="item4">li>
<li class="item3">li>
ul>2.0生成文本内容{}
a[href="www.google.com"]{click me}
或者
a[href="www.google.com"]>{click me}<a href="www.google.com">click mea>