我们做网站，在不影响整个网页构架与功能的情况下，网页文件越小越好，越小的文件浏览器加载就越快，访客就不用等待太久网页就打开了，这一点对于那些带宽少网速慢的用户犹为明显。
DIV+CSS的布局方式已经将以前Table布局时代码的臃肿代码降到了最低，但仍然不得不说网页文件精简到最小还是网页设计师们所应该考虑的问题之一。
看如下一段代码：
#header { margin-top:10px; margin-right:15px; margin-bottom:10px; margin-left:15px; background-color:#333333; background-images:url(Images/header.jpg); }
这样的一段CSS代码，在条理上很清晰，结构也很明了，可读性很强，可是这样的一段代码却没有做精简，也就是说它是最原始的CSS代码，下面看精简后的代码：
#header { margin:10px 15px;
background:#333 url(Images/header.jpg);
}
在CSS中有复合属性这一说法，也就是说可以将很多属性参数整合在一起，比如说上面的“margin-top; margin-right; margin-bottom; margin-left;”可以整合成一个“margin”属性。
通过这一点，我们就可以在原始CSS代码的基础上将代码进一步的精简。而且这样写的结构也合理，可读性也强。可是对于要精简到彻底来说，这还不够呢。为了让这段CSS代码的结构明了，我们用上了空格换行等占用空间的东西，如果将这些占用空间的去掉呢？
#header{margin:10px 15px;background:#333 url(Images/header.jpg);}
只这一句就替代了上面的一段代码，这样代码就已经精简到了最大化，当然，并不推荐所有人都这样写，这样写的CSS代码在可读性上要远远差于段落式的写法，除非你对自己写的代码有完全掌握的信心。
在同一个站点的CSS文件中，不可避免的会出现不同的ID或Class却有一部分相同的属性，如果将这些ID或Class逐个分开来写的话，在CSS文件里无疑会生成重复代码，而我们要尽量的精简CSS文件的大小，那么去掉这部分重复的代码就变得非常必要。
看下面一段CSS代码：
#header{margin:10px 15px;background:#333 url(Images/header.jpg);}
#content{margin:10px 15px;padding:10px;background:#999;}
#copyright{margin:10px 15px;border:1px solid #f00;}
在上面的三个ID中都有一个相同的属性“margin:10px 15px;”，如果就这样分开来写的话，这三个ID之间将保持各自独立的关系，但却生成了重复的代码，而我们可以将其写成如下格式：
#header,#content,#copyright{margin:10px 15px;}
#header{background:#333 url(Images/header.jpg);}
#content{padding:10px;background:#999;}
#copyright{border:1px solid #f00;}
将上面的ID换成Class也是一样的。这样写我们就成功的将重复代码去掉了，精简了代码。
在网页设计中，精简CSS代码控制网页文件大小，提升网站速度是所有网页设计师应该考虑的问题。