原文鏈接：http://blog.csdn.net/lmmilove/article/details/9181323

?

因為開始做web項目，所以最近在用sublime編輯器，知道了一個傳說中的emmet，原名是zen coding。html神插件可以說是。文章部分內(nèi)容轉(zhuǎn)自http://www.cnblogs.com/meetrice/archive/2013/01/27/2878548.html

在sublime 中，促發(fā)emmet 可以先保存為.html文件。然后輸入下面的簡寫，按tab鍵就可促發(fā)效果了。

?

1. 生成html格式

輸入 html:5

?

2. 簡寫Div

?

大家可以看到，不管你是否添加了div，Emmet都會自動生成需要div元素。

含糊標簽名稱

這個技巧屬于implicit tag names特性，你不需要指定div或者li，Emmet會自動幫助你生成，如下：

3. 帶有DOM導(dǎo)航的鏈式縮寫

如果你使用Emmet來擴展簡單的class名稱生成div的話。這個方式可以幫助你省去大量的時間。你只需要記住如下語法：

• > 子節(jié)點：在DOM樹下一層添加創(chuàng)建一個元素
• + 同級別：在DOM樹同一層添加創(chuàng)建一個元素
• ^ 向上層：向上一層添加創(chuàng)建創(chuàng)建一個元素。

向上一層

如果需要的話你可以向上多層，如下：

4. 使用分組來簡化你的代碼結(jié)構(gòu)

有的時候你可能會發(fā)現(xiàn)使用向上符號比較復(fù)雜，這時候可能使用分組更加的合理。如下：

一個更復(fù)雜一些的例子，如下：

5. 插入文本和屬性

如果你需要生成HTML，內(nèi)容和屬性也是你常常需要添加的。很多開發(fā)人員只是使用Emmet來生成框架，然后再添加內(nèi)容。其實你可以在生成頁面框架的過程中同時添加屬性和內(nèi)容。

從下面代碼可以看到，你輸入的文字和屬性都可以分別通過大括號和中括號來生成。

6. 添加多個class到一個元素?

這個非常簡單，你只需要使用逗號來添加多個class，如下：

7. ?重復(fù)添加

這可能是最讓人舒服的操作了，幫助你重復(fù)添加元素：

如果你整合分組功能，那么你將能夠處理更復(fù)雜的HTML生成：

8. 自動列表記數(shù)?

如果你需要按順序生成HTML元素，這個技巧你一定喜歡，使用$符號可以幫助你生成一系列數(shù)字，支持class，id，屬性，內(nèi)容等等。如下：

注意如果你需要生成2位的數(shù)字，使用兩個$符號即可。?

轉(zhuǎn)載于:https://www.cnblogs.com/zhongshiqiang/p/5990081.html

總結(jié)

以上是生活随笔為你收集整理的sublime text 2中Emmet8个常用的技巧的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。