代码优化的作用：
- 压缩代码量，提高编写效率
- 提高了文件的访问速度，利于快速编译
- 简化代码，便于复用，利于后期维护和扩展。
- 利用继承性优化代码
在CSS中，子元素会自动继承父元素的属性值，如颜色、字体、大小、行距等排版格式。
如：
a：link {
color：#000000;
text-decoration：none;
}
a：visited {
text-decoration：none;
color：#0000FF;
}
a：hover {
text-decoration：none;
color：#FF0000;
}
a：active {
text-decoration：none;
color：#00FF00;
}
可优化为：
a {
text-decoration：none;
}
a：link {
color：#000000;
}
a：visited {
color：#0000FF;
}
a：hover {
color：#FF0000;
}
a：active {
color：#00FF00;
}
注意：一般来说如布局、盒模型属性的display、width、height等只使用自己的属性值，不会继承上级元素。
利用默认值优化代码：
CSS的属性一般都预定义默认值，如果定义的属性值与默认值相同，就没必要再重复定义了。
使用*号来定义默认值。
利用公共类优化代码：
如：
span {
color：red;
font-size：14px;
}
#tips {
color：red;
width：100%;
}
.msg {
color：red;
font-size：12px;
line-height：1.6em;
}
可简化为：
span {
font-size：14px;
}
#tips { width：100%; }
.msg {
font-size：12px;
line-height：1.6em;
}
.red {
/*<定义红色公共类>*/
color：Red;
}
html标签中进行调用 ：<div class="msg red" ></div>
利用选择符分组优化代码：
如：
h1 { font-family："黑体"; }
h2 { font-family："黑体"; }
h3 { font-family："黑体"; }
h4 { font-family："黑体"; }
h5 { font-family："黑体"; }
h6 { font-family："黑体"; }
可以优化为：
h1,h2,h3,h4,h5,h6 { font-family："黑体"; }
定义单独的样式：
h1,h2,h3,h4,h5,h6 { font-family："黑体"; }
h1 { font-size：20px; }
h2 { font-size：18px; }
h4 { font-size：12px; }
利用层叠覆盖优化代码：
如果对同一个元素定义了多个样式，在相同特殊性的情况下，CSS会遵循最近原则应用样式，也就是说相同属性声明，后面的值会覆盖前面的值。
如：
#title1,#title2,#title3 {
font-size：14px;
font-weight：bold;
text-align：center;
}
#title1 { color：Blue; }
#title1 { color：Red; }
#title1 { color：Green; }
可优化为：
#title1,#title2,#title3 {
font-size：14px;
font-weight：bold;
text-align：center;
color：Blue;
}
#title2 { color：Red; }
#title3 { color：Green; }
代码优化的注意事项：在优化时，要适当采用就近原则，在同一模块内进行优化，不过有些具有全局属性的内容可以统一定义，如网页字体、大小、行距等。