縮寫語法
Emmet 使用類似于 CSS 選擇器的語法描述元素在生成的文檔樹中的位置及其屬性。
元素
可以使用元素名（如 div 或者 p）來生成 HTML 標(biāo)簽。Emmet 沒有預(yù)定義的有效元素名的集合，可以把任何單詞當(dāng)作標(biāo)簽來生成和使用：div → <div></div>, foo → <foo></foo> 等。
嵌套運(yùn)算符
嵌套運(yùn)算符用于以縮寫的方式安排元素在生成文檔樹中的位置：將其放在內(nèi)部或成為相鄰的元素。
element >
可以使用 > 運(yùn)算符指定嵌套元素在另一個(gè)元素內(nèi)部：
div>ul>li
生成的結(jié)果為：
<div>
<ul>
<li></li>
</ul>
</div>
兄弟: +
使用 + 運(yùn)算符將相鄰的其它元素處理為同級(jí)：
div+p+bq
生成的結(jié)果為：
<div></div>
<p></p>
<blockquote></blockquote>
上升: ^
使用 > 運(yùn)算符將會(huì)降低所有后續(xù)所有元素在生成樹中的級(jí)別，每一級(jí)的兄弟元素也被解析成相同深度的元素：
div+div>p>span+em
將生成：
<div></div>
<div>
<p><span></span><em></em></p>
</div>
使用 ^ 運(yùn)算符，能夠提升元素在生成樹中的一個(gè)級(jí)別，并同時(shí)影響其后的元素：
div+div>p>span+em^bq
將生成：
<div></div>
<div>
<p><span></span><em></em></p>
<blockquote></blockquote>
</div>
可以連續(xù)使用多個(gè) ^ 運(yùn)算符，每次提高一個(gè)級(jí)別：
div+div>p>span+em^^^bq
將生成：
<div></div>
<div>
<p><span></span><em></em></p>
</div>
<blockquote></blockquote>
重復(fù): *
使用 * 運(yùn)算符可以定義一組元素：
ul>li*5
將生成：
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
分組: ()
括號(hào)用于在復(fù)雜的 Emmet 縮寫中處理一組子樹：
div>(header>ul>li*2>a)+footer>p
將生成：
<div>
<header>
<ul>
<li><a href=""></a></li>
<li><a href=""></a></li>
</ul>
</header>
<footer>
<p></p>
</footer>
</div>
如果想與瀏覽器 DOM 協(xié)同工作，可能想要對(duì)文檔片段分組：每個(gè)組包含一個(gè)子樹，所有的后續(xù)元素都插入到與組中第一個(gè)元素相同的級(jí)別中。
能夠在組中嵌套組并且使用 * 運(yùn)算符綁定它們：
(div>dl>(dt+dd)*3)+footer>p
將生成：
<div>
<dl>
<dt></dt>
<dd></dd>
<dt></dt>
<dd></dd>
<dt></dt>
<dd></dd>
</dl>
</div>
<footer>
<p></p>
</footer>
使用分組，可以使用單個(gè)縮寫逐個(gè)寫出整頁的標(biāo)簽，不過盡量不要這么做。
屬性運(yùn)算符
屬性運(yùn)算符用于編輯所生成的元素的屬性，在 HTML 和 XML 中可以快速地為生成元素添加 class 屬性。
ID 和 CLASS
在 CSS 中，可以使用 elem#id 和 elem.class 注解來達(dá)到為元素指定 id 或 class 屬性的目的。在 Emmet 中，可以使用幾乎相同的語法來為指定的元素添加這些屬性：element:
div#header+div.page+div#footer.class1.class2.class3
生成：
<div id="header"></div>
<div class="page"></div>
<div id="footer" class="class1 class2 class3"></div>
自定義屬性
可以使用 [attr] 注解（就像在 CSS 中一樣）來為元素添加自定義屬性：
td[title="Hello world!" colspan=3]
將生成：
<td title="Hello world!" colspan="3"></td>
能夠在方括號(hào)中放置許多屬性，
可以不為屬性指定值： td[colspan title] 將生成 <td colspan="" title=""> ，如果你的編輯器支持，可以使用 tab 來跳到每個(gè)空屬性中填寫。
屬性可以用單引號(hào)或雙引號(hào)作為定界符。
如果屬性不包含空格，不需要用定界符括住它：td[title=hello colspan=3] 是正確的。
編號(hào): $
使用 * 運(yùn)算符可以重復(fù)生成元素，如果帶 $ 就可以為它們編號(hào)。把 $ 放在元素名、屬性名或者屬性值中，將為每個(gè)元素生成正確的編號(hào)：
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>
使用多 $ 可以填充前導(dǎo)的零：
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>
改變編號(hào)的基數(shù)和方向
使用 @ ，可以改變數(shù)字的走向（升序或降序）和基數(shù)（例如起始值）。
在 $ 后添加 @- 來改變數(shù)字走向：
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 改變編號(hào)的基數(shù)：
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>
這些附加的運(yùn)算符可以同時(shí)使用：
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>
文本: {}
可以用花括號(hào)向元素中添加文本：
a{Click me}
將生成：
<a href="">Click me</a>
注意，這個(gè) {text} 是被當(dāng)成獨(dú)立元素解析的（類似于 div, p ），但當(dāng)其跟在其它元素后面時(shí)則有所不同。例如， a{click} 和 a>{click} 產(chǎn)生相同的輸出，但是 a{click}+b{here} 和 a>{click}+b{here} 的輸出就不同了：
<!-- a{click}+b{here} -->
<a href="">click</a><b>here</b>
<!-- a>{click}+b{here} -->
<a href="">click<b>here</b></a>
在第二示例中， <b/> 元素放在了 <a/> 元素的里面。差別如下：當(dāng) {text} 寫在元素的后面，它不影響父元素的上下文。下面是展示這種差別的重要性的較復(fù)雜的例子：
p>{Click }+a{here}+{ to continue}
生成：
<p>Click <a href="">here</a> to continue</p>
在這個(gè)例子里， 我們用 > 運(yùn)算符明確的將 Click here to continue 下移一級(jí)，放在 <p> 元素內(nèi)，但對(duì)于 a 元素的內(nèi)容就不需要了，因?yàn)?<a/> 僅有 here 這一部分內(nèi)容，它不改變父元素的上下文。
作為比較，下面是不帶有 > 運(yùn)算符的相同縮寫：
p{Click }+a{here}+{ to continue}
生成：
<p>Click </p>
<a href="">here</a> to continue
縮寫格式的注意事項(xiàng)
當(dāng)熟悉了 Emmet 的縮寫語法后，可能會(huì)想要使用一些格式來生成更可讀的縮寫。例如，在元素和運(yùn)算符之間使用空格間隔：
(header > ul.nav > li*5) + footer
但是這種寫法是錯(cuò)誤的，因?yàn)榭崭袷?Emmet 停止縮寫解析的標(biāo)識(shí)符。
請(qǐng)多用戶誤以為每個(gè)縮寫都應(yīng)寫在新行上，但是他們錯(cuò)了：可以在文本的任意位置鍵入和擴(kuò)展縮寫。
縮寫不是模板語言，它們不需要”易讀“，它們必須”可快速擴(kuò)展和移動(dòng)“。
不需要寫復(fù)雜的縮寫。不要認(rèn)為在 web 編程中”鍵入“是最慢的運(yùn)算。想快速找出構(gòu)建單個(gè)的復(fù)雜縮寫比構(gòu)造和鍵入一些較短較簡(jiǎn)單的縮寫更慢。
