【01】emmet系列之基础介绍
【02】emmet系列之html语法
【03】emmet系列之css语法
【04】emmet系列之编辑器
【05】emmet系列之各种缩写
单位：
有几个常用值别名：
p % e em x ex example:
输入:
w100p  输出:
width:100%  
example:
输入:
m10p30e5x  输出:
margin:10%30em5ex  
example:
输入：
h10p+m5e
输出：
height:10%;margin:5em;  
颜色值：
bd5#0s 输出：
border:5px#000 solid
你可以写一个，两个，三个或六个字符的颜色值：
#1 #111111 #e0 #e0e0e0 #fc0 #ffcc00
！important修饰符
您可以添加!在任何css缩写，以便获得最终的后缀!important价值：
p !+ m10e ! 输出：
padding :! important ; margin :10 em ! important ;  
浏览器前缀：
如果输入非w3c标准的css属性，emmet会自动加上供应商前缀，比如输入
-bdrs 输出：
-webkit-border-radius:; -moz-border-radius:; -ms-border-radius:; -o-border-radius:; border-radius:;
[魔芋注]在emmet中我们只需修改旋转属性值的其中一个，再按ctrl+b快捷键，其它相关的属性值也相应的改变。（如果无效，可能与sublime的快捷键冲突，修改之）
比如输入trs，则会生成：
-webkit-transform:; -moz-transform:; -ms-transform:; -o-transform:; transform:;
输入：
trf 输出：
-webkit-transform:; -ms-transform:; -o-transform:; transform:;
你也可以在任意属性前加上“-”符号，也可以为该属性加上前缀。比如输入-super-foo：
-webkit-super-foo:; -moz-super-foo:; -ms-super-foo:; -o-super-foo:; super-foo:;
如果不希望加上所有前缀，可以使用缩写来指定，比如-wm-trf表示只加上-webkit和-moz前缀： 
-webkit-transform:; -moz-transform:; transform:;
前缀缩写如下： 
w 表示 -webkit- m 表示 -moz- s 表示 -ms- o 表示 -o- 附加属性  可能你之前已经了解了一些缩写，比如 @f，可以生成：
@font-face { font-family:; src:url(); }  
一些其他的属性，比如background-image、border-radius、font、@font-face,text-outline、text-shadow等额外的选项，可以通过“+”符号来生成，比如输入@f+，将生成：
@font-face { font-family:'fontname'; src: url('filename.eot'); src: url('filename.eot?#iefix') format('embedded-opentype'), url('filename.woff') format('woff'), url('filename.ttf') format('truetype'), url('filename.svg#fontname') format('svg'); font-style: normal; font-weight: normal; }
模糊匹配 
如果有些缩写你拿不准，emmet会根据你的输入内容匹配最接近的语法，比如输入ov:h、ov-h、ovh和oh，生成的代码是相同的：
overflow: hidden;  
渐变  输入lg(left, #fff 50%, #000)，会生成如下代码：
background-image:-webkit-gradient(linear,00,100%0, color-stop(0.5,#fff), to(#000)); background-image:-webkit-linear-gradient(left,#fff 50%, #000); background-image:-moz-linear-gradient(left,#fff 50%, #000); background-image:-o-linear-gradient(left,#fff 50%, #000); background-image: linear-gradient(left,#fff 50%, #000);
lg(left,#fc0 30%,red) 输出：
background-image:-webkit-linear-gradient(left,#fc0 30%, red); background-image:-o-linear-gradient(left,#fc0 30%, red); background-image: linear-gradient(to right,#fc0 30%, red);
border-image:lg(left,#fc0 30%,red) 输出：
-webkit-border-image:-webkit-linear-gradient(left,#fc0 30%, red); -o-border-image:-o-linear-gradient(left,#fc0 30%, red); border-image:linear-gradient(to right,#fc0 30%, red);  
技巧篇  
1，对于一些带有特定的属性值的css样式，只需输入css标签与属性值的首字母就可以，比如：
fl →float: left;  
2，编写这些css样式时，有很多是我们想好的写法，但生成的不是你想要的，比如position: absolute;，我们会输入pa，生成的就不是position: absolute;，这时我们可以：
poa → position: absolute;  
3，一些用-连接的css样式和属性值，都可以取首字母：
whscbs → whitewhite-space-collapse:break-strict;
4，对于有多个属性值的css属性，在编写时只需在属性值之间添加-：
m4-6→ margin:4px6px; p4-6-8→ padding:4px6px8px;
5，属性值没有单位的css缩写：
lh2 → line-height:2;, fw400 → font-weight:400;
这些css属性有：
z-index, line-height, opacity and font-weight
6，#是一个值分离器，所以不需要使用连字符分隔它，例如：
bd5#0s → border: 5px #000 solid:
7，输出默认的css样式+，用+操作符，比如：
bg+→ background:#fff url() 0 0 no-repeat;