Sublime Text2 中Emmet(之前叫Zencoding)插件安裝以及使用
Emmet插件安裝
Emmet放出來有一段時間了一直安裝失敗,今天再仔細的看了文檔在安裝上。
在windows上安裝時很有可能報錯說PyV8
安裝失敗,需要到一個github地址上去安裝。詳細的安裝方法是:
官方說的用Package Control :install package
安裝Emmet
十有八九會報錯。所以這里介紹手動安裝過程:
-
先安裝PyV8
,點擊此處選擇適合的操作系統版本,將下載的zip包放在 Sublime Text 2的Package包中,可以通過ST2的菜單Preferences
->Browser Packages
進入該文件夾,win7默認的是C:\Users\[用戶名]\AppData\Roaming\Sublime Text 2\Packages
將zip包解壓出來的文件放到新建的PyV8
文件夾中
-
下載Emment最新版此處解壓到Packages
文件夾中
-
重啟 OK
2013/10/31 update: 最近Emmet插件有更新,安裝起來不需要手動安裝PyV8了。直接用Package Install就行可以。
Emmet的新特征
默認的tag是div
.item [tab]
<div class="item"></item>
聰明的子標簽嵌套規則,比如ul的子標簽默認就是li
ul>.item*2 [tab]
<ul>
<li></li>
<li></li>
</ul>
^
向上,相當于將當前的"上下文"放到父標簽上,寫dl>dt/dd的時候用的上
dl>(dt>p>a[name=dt$]^^dd{description$})*2 [tab]
<dl>
<dt>
<p><a href="" name="dt1"></a></p>
</dt>
<dd>description1</dd>
<dt>
<p><a href="" name="dt2"></a></p>
</dt>
<dd>description2</dd>
</dl>
$
的功能增強
之前用zencoding的時候我想寫一組checkbox各加上一個label,checkbox的name屬性一致,但是id不一樣,而且對應的label的for屬性能對應到checkbox的id上。
(input:checkbox[name=cb1]#cbitem$$+label[for=cbitem$$]{label$})*2 [tab]
<input type="checkbox" name="cb1" id="cbitem01">
<label for="cbitem01">label1</label>
<input type="checkbox" name="cb1" id="cbitem02">
<label for="cbitem02">label2</label>
zencoding寫出來的label和id是不能編號的。Emmet解決了這個問題。
其他的功能都是原來zencoding有的,給一些參考資料:
zencoding cheatsheet啥也不說了。趕緊去打印貼著吧。
分享7個超實用的Emmet(zen coding)HTML代碼使用技巧直接激起了我再次安裝emmet的興趣
emmet at github 其實仔細看看文檔上說的安裝就應該簡單。
好了,就寫這么多,2013第一文,我廠的年會此時已經接近尾聲了,今年的年會不能參加灰常遺憾。美女確實不錯,呵呵。