缩写值可以减少CSS文件大小，并增加可读性和可维护性。
但并非所有的值都必须缩写，因为当一个属性的值缩写时，总是会将所有项都设置一遍，而有时候我们不希望设置值里的某些项。
/* 比如我们用下面这个样式来让某个定宽的容器水平居中，我们要的只是left和right，
* 而top和bottom不是这个样式要关心的（如果设置了反倒会影响其他样式在这个容器上的使用），
* 所以这时我们就不需要缩写
*/
.f-mgha { margin-left:auto; margin-right:auto;}
/* 比如下面这个模块的样式设置，我们确实需要设置padding的所有项，于是我们就可以采用缩写 */
.m-link { padding:6px 12px;}
常用的缩写方法请参见代码格式。
以下所举列的属性可能造成渲染性能问题。不过有时候需求大于一切……
/* expression */
.class { width:expression(this.width>100?'100px':'auto');}
/* filter */
.class { filter:alpha(opacity=50);}
即CSS选择器组合，可以一次定义多个选择器，为你节省很多字节和宝贵时间。
通常我们会将定义相同的或者有大部分属性值相同（确实是因为相关而相同）的一系列选择器组合到一起（采用逗号的方法）来统一定义。
/* 以下对布局类选择器统一做了清除浮动的操作 */
.g-hd:after, .g-bd:after, .g-ft:after { display:block; visibility:hidden; clear:both; height:0; content:".";}
.g-hd, .g-bd, .g-ft { zoom:1;}
/* 通常background总是会占用很多字节，所以一般情况下，我们都会这样统一调用 */
.m-logo, .m-help, .m-list li, .u-tab li, .u-tab li a { background:url(../images/sprite.png) no-repeat 9999px 9999px;}
.m-logo { background-position:0 0;}
/* 以下是某个元件的写法，因为确实很多元素是联动的或相关的，所以采用了组合写法，可以方便理解和修改 */
.u-tab li ,.u-tab li a { display:inline; float:left; height:30px; line-height:30px;}
.u-tab li { margin:0 3px;}
.u-tab li a { padding:0 6px;}
并不是把所有的图标都合并在一张图片里就是最好的，除了要控制图片大小之外还要注意以下方法。
让CSS做更多的事，减轻JS开发量。
如果你做到了“CSS规范”的所有要求，自然你也就写出了一个便于阅读和修改的漂亮的CSS。
如果你做到了命名规则的要求，你的CSS模块也就清晰可见了。
用“注释”来说明每一个模块对于较大的CSS文件来说显得尤为重要。
合理的书写CSS能很大程度上减少文件大小，完成后，在不损坏文件内容的情况下，想尽一切办法压缩你的CSS，你可以借助压缩工具把注释和多余的空格、换行去掉。
压缩后的css文件统一加上.min后缀，比如base.css压缩后的文件名是base.min.css，原有的css文件不动，留作后期修改。
压缩工具详见：W3CFuns前端神器。
优化方法请参见代码格式。