最近搞了下前端的東西，用的sublime text3榄融，但他不像Xcode一樣代碼的提示什么的都是搞好的的莲镣。所以曙强，如果開始開發(fā)前端的話好用的插件是必須的残拐，這里介紹下Emmet的用法。
Emmet
Emmet的前身是Zen coding碟嘴，使用仿CSS選擇器的語法來生成代碼溪食，大大提高HTML/CSS代碼編寫的速度，其特性如下娜扇。
一错沃、編寫HTML代碼
- 初始化 HTML文檔需要包含一些固定的標簽栅组，比如<html>、<head>枢析、<body>等玉掸，現(xiàn)在你只需要1秒鐘就可以輸入這些標簽。比如輸入“!”或“html:5”醒叁，然后按Tab鍵司浪。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
</body>
</html>
2.輕松添加類、id把沼、文本和屬性 連續(xù)輸入元素名稱和ID断傲，Emmet會自動為你補全，比如輸入p#foo智政。
<p id=”foo”></p>
3.嵌套 現(xiàn)在你只需要1行代碼就可以實現(xiàn)標簽的嵌套。
>：子元素符號箱蝠，表示嵌套的元素
+：同級標簽符號
^：可以使該符號前的標簽提升一行
4 . 分組 你可以通過嵌套和括號來快速生成一些代碼塊续捂，比如輸入(.person>h1)+(.> dog)，會自動生成如下代碼：
<div class=” person”>
<h1></h1>
</div>
<div class=”dog”>
<h2></h2>
</div>
5.隱式標簽 聲明一個帶類的標簽宦搬，只需輸入div.item牙瓢，就會生成<div class=”item”></div>。 在過去版本中间校，可以省略掉div矾克，即輸入.item即可生成<div class=”item”></div>。現(xiàn)在如果只輸入.item憔足，則Emmet會根據父標簽進行判定胁附。比如在<ul>中輸入.item，就會生成<li class=”item”></li>滓彰。
6.定義多個元素 要定義多個元素控妻，可以使用符號。比如揭绑，ul>li2可以生成如下代碼：
<ul>
<li></li>
<li></li>
</ul>
7 . 定義多個帶屬性的元素 如果輸入 ul>li.item$*3弓候，將會生成如下代碼：
<ul>
<li class=”item1″></li>
<li class=”item2″></li>
<li class=”item3″></li>
</ul>
二、CSS
- 值 比如要定義元素的寬度他匪，只需輸入w100菇存，即可生成
width: 100px;
- 附加屬性 可能你之前已經了解了一些縮寫，比如 @f依鸥，可以生成：
@font-face {
font-family:;
src:url();
}
- 模糊匹配 比如輸入ov:h和oh畦徘，生成的代碼是相同的：
overflow: hidden;
- 供應商前綴 如果輸入非W3C標準的CSS屬性溶握，Emmet會自動加上供應商前綴睡榆，比如輸入trs，則會生成：
-webkit-transform: ;
-moz-transform: ;
-ms-transform: ;
-o-transform: ;
transform: ;
