为了更好的学习Emmet的使用，干脆自己尝试翻译一下，顺便练练英语。
本文译自 Emmet官方文档：Abbreviations Syntax
缩写语法
Emmet 工具使用的语法类似 CSS选择器，通过元素的位置的描述生成树和元素的属性。
元素
你可以使用元素名，像 div或p这样的方式生成HTML标签。Emmet没有预先设定一组可用的标签名，你可以通过输入任何单词然后生成一组标签，比如：
div → <div></div>,foo → <foo></foo>
嵌套操作
我们可以通过嵌套元素缩写词的方式去生成HTML树，无论是子级元素，和同级元素。
后代元素：>
你可以在各元素之间使用>操作符表示嵌套。
div>ul>li
输出：
<div>
<ul>
<li></li>
</ul>
</div>
同级（兄弟）元素:+
在元素间使用+操作符，使其处于同级。
div+p+bq
输出：
<div></div>
<p></p>
<blockquote></blockquote>
生成上级元素：^
With > operator you’re descending down the generated tree and positions of all sibling elements will be resolved against the most deepest element:
通过>操作符向下生成目录树和所有同级元素的位置可以渲染出更深层的元素。
div+div>p>span+em
会展开为：
<div></div>
<div>
<p><span></span><em></em></p>
</div>
通过^操作符，你可以使一个元素上升一个层次，同时该元素会出现在后面：
div+div>p>span+em^bq
输出：
<div></div>
<div>
<p><span></span><em></em></p>
<blockquote></blockquote>
</div>
如果你喜欢，你也可以使用多个^操作符，每一个操作符都会使其提升一级。
div+div>p>span+em^^^bq
输出：
<div></div>
<div>
<p><span></span><em></em></p>
</div>
<blockquote></blockquote>
