介绍
emmet (前身为 zen coding) 是一个能大幅度提高前端开发效率的一个工具。
基本上，大多数的文本编辑器都会允许你存储和重用一些代码块，我们称之为“片段”。虽然片段能很好地推动你得生产力，但大多数的实现都有这样一个缺点：你必须先定义你得代码片段，并且不能再运行时进行拓展。
emmet把片段这个概念提高到了一个新的层次：你可以设置css形式的能够动态被解析的表达式，然后根据你所输入的缩写来得到相应的内容。emmet是很成熟的并且非常适用于编写html/xml 和 css 代码的前端开发人员，但也可以用于编程语言。
示例 在编辑器中输入缩写代码ul>li*5，然后按下拓展键（默认为tab），即可得到代码片段：
下载和安装 编辑器插件 以下都是emmet为编辑器提供的安装插件。
sublime text
eclipse/aptana
textmate
coda
espresso
chocolat
komodo edit
notepad++
pspad
textarea
codemirror
brackets
netbeans
adobe dreamweaver
在线编辑器的支持： jsfiddle
js bin
codepen
icecoder
divshot
codio
第三方插件的支持 下面这些编辑器的插件都是由第三方开发者所提供的，所以可能并不支持所有emmet的功能和特性。
synwrite
webstorm
phpstorm
vim
html-kit
hippoedit
codelobster php edition
tinymce
语法 后代：> nav>ul>li
兄弟：+ div+p+bq
上级：^ div+div>p>span+em^bq
div+div>p>span+em^^bq
分组：() div>(header>ul>li*2>a)+footer>p
(div>dl>(dt+dd)*3)+footer>p
乘法：* ul>li*5
自增符号：$ ul>li.item$*5
h$[title=item$]{header $}*3
header 1header 2header 3
ul>li.item$$$*5
ul>li.item$@-*5
ul>li.item$@3*5
id和类属性 #header
.title
form#search.wide
p.class1.class2.class3
自定义属性 p[title=hello world]
td[rowspan=2 colspan=3 title]
[a='value1' b=value2]
文本：{} a{click me}
click me
p>{click }+a{here}+{ to continue}
click here to continue
隐式标签 .class
em>.class
ul>.class
table>.row>.col
html 所有未知的缩写都会转换成标签，例如，foo →
!
document
a
a:link
a:mail
abbr
acronym
base
basefont
br
frame
hr
bdo
bdo:r
bdo:l
col
link
link:css
link:print
link:favicon
link:touch
link:rss
link:atom
meta
meta:utf
meta:win
meta:vp
meta:compat
style
script
script:src
img
iframe
embed
object
param
map
area
area:d
area:c
area:r
area:p
form
form:get
form:post
label
input
input:text input:t inp
input:hidden input:h input[type=hidden name]
input:search inp[type=search]
input:email inp[type=email]
input:url inp[type=url]
input:password input:p inp[type=password]
input:datetime inp[type=datetime]
input:date inp[type=date]
input:datetime-local inp[type=datetime-local]
input:month inp[type=month]
input:week inp[type=week]
input:time inp[type=time]
input:number inp[type=number]
input:color inp[type=color]
input:checkbox input:c inp[type=checkbox]
input:radio input:r inp[type=radio]
input:range inp[type=range]
input:file input:f inp[type=file]
input:submit input:s
input:image input:i
input:button input:b
input:reset input:button[type=reset]
select
option
textarea
menu:context menu:c menu[type=context]
menu:toolbar menu:t menu[type=toolbar]
video
audio
html:xml
keygen
command
bq blockquote
acr acronym
fig figure
figc figcaption
ifr iframe
emb embed
obj object
src source
cap caption
colg colgroup
fst fset fieldset
btn button
btn:b button[type=button]
btn:r button[type=reset]
btn:s button[type=submit]
最后 关于更多的html以及css的缩写请查看：官网文档