看了一些关于emmet插件写法的文档，港真，怎么可以写这么长啊。其实知道几个大概要点加上实践基本就能上手写了啊
杂话
我前面有一篇【今天发现新大陆：haml和emmet 】，其实一开始的想法是写给自己看的。
有人去阅读我的博客和评论，虽然不算多，但是对于我这种刚入门的小白渣渣还是受宠若惊的。我这大喜的蠢样子也是经常被男票说四不四傻……ㄟ(⊙ω⊙ㄟ)
嗯，跑偏了。总之，以后写东西不管是给自己看也好，给别人看都好。秉持着分享的精神一定认真好好的写(~q~)
关于emmet
emmet插件的前身是zen coding，可以大幅度提高前端开发效率的一个工具，也有人说类似于jade（高性能的模板引擎,它深受 haml 影响,它是用 javascript 实现的,并且可以供 node 使用）。再官方一些的官方语言的叽叽喳喳我就不详写了，直接百度可以找到。
emmet支持的编辑器：
sublime text 2textmate 1.xeclipse/aptanacoda 1.6 and 2.xespressochocolat （通过“install mixin”对话框添加)komodo edit/ide （通过tools → add-ons菜单添加)notepad++pspadcodemirror2/3brackets
第三方插件的支持
下面这些编辑器的插件都是由第三方开发者所提供的，所以可能并不支持所有emmet的功能和特性。
synwritewebstormphpstormvimhtml-kithippoeditcodelobster php editiontinymce 
emmet安装方法(sublime text 3安装emmet插件的方法：http://blog.csdn.net/mengke1124/article/details/41696779)
因为我用的是sublime text 3，其他编辑器安装的方法可能要根据自己的需要在网上搜刮了
emmet插件实用常用方法
（http://www.w3cplus.com/tools/emmet-cheat-sheet.html）
这篇文档写的很清晰，也有安装插件的方法。但是介绍的方法太多，感觉有点冗长，我汇总了一些我个人觉得比较实用常用的方法。
略写版：
div>(header>ul>li*2>a)+footer>p(+号连接下一个兄弟元素)
(div>dl>(dt+dd)*3)+footer>p(括号内为一个组)
ul>li$[title=item$]{hhh $}*5(li$,表示li自增+1)
h.item${hhh $}*5({}括号内为显示文本)
ul>li.item$$$*5($为自增,三个$为三位数字)
ul>li.item$@3*5(@从3开始自增+1)
ul>li.item$@-*5(@-,自减)
ul>li.item$@-3*5(@-3,自减最小数字为3)
form#search.wide(#为id,.为类)
p[title='hello word'](自定义属性)
(隐式标签)
.class
em>.class
ul>.class
table>.row>.col
!(页面html开始代码缩写)
(缩写)
a
a:link
hr
link
link.css
meta:utf
script:src
img
详写版：
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>
ul>li*5(>为后代缩写,*表示有几个)
ul> li>li> li>li> li>li> li>li> li>li>ul>
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>
(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>
ul>li$[title=item$]{hhh $}*5(li$,表示li自增+1)
ul> li1 title=item1>hhh 1li1> li2 title=item2>hhh 2li2> li3 title=item3>hhh 3li3> li4 title=item4>hhh 4li4> li5 title=item5>hhh 5li5>ul>
h.item${hhh $}*5({}括号内为显示文本)
h class=item1>hhh 1h>h class=item2>hhh 2h>h class=item3>hhh 3h>h class=item4>hhh 4h>h class=item5>hhh 5h>
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>
ul>li.item$@3*5(@从3开始自增+1)
ul> li class=item3>li> li class=item4>li> li class=item5>li> li class=item6>li> li class=item7>li>ul>
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>
ul>li.item$@-3*5(@-3,自减最小数字为3)
ul> li class=item7>li> li class=item6>li> li class=item5>li> li class=item4>li> li class=item3>li>ul>
form#search.wide(#为id,.为类)
form action= id=search class=wide>form>
p[title='hello word'](自定义属性)
p title=hello word>p>
(隐式标签)
.class
div class=class>div>
em>.class
em>span class=class>span>em>
ul>.class
ul> li class=class>li>ul>
table>.row>.col
table> tr class=row> td class=col>td> tr>table>
!(页面html开始代码缩写)
doctype html>html lang=en>head> meta charset=utf-8> title>documenttitle>head>body> body>html>
(缩写)
a
a href=>a>
a:link
a href=http://>a>
hr
hr>
link
link rel=stylesheet href=>
link.css
link rel=stylesheet href= class=css>
meta:utf
meta http-equiv=content-type content=text/html;charset=utf-8>
script:src
script src=>script>
img
img src= alt=>
官方api：http://docs.emmet.io/cheat-sheet/
api表：http://www.w3cplus.com/sites/default/files/baiyaimages/cheatsheet.jpg
(●-●) 真心讨厌弄文本格式，感觉好浪费时间……