编写出色css代码的13个建议

编写出色css代码的13个建议—总结至《前端大全》公众号
一：使用Reset但不用全局Reset
如*{margin：0；padding：0；}

这不仅仅因为它缓慢和效率低，而且会导致一些不必要的元素也重置了外边距和内边距。Reset不是一成不变的，具体还是要根据项目的不同需求做适当的修改，已达到浏览器的兼容和操作上的便利性。我使用的Reset如下：
structural elements结构元素：body,h1,h2,h3,h4,h5,h6,hr,p
，blockquote
list elements列表元素：dl,dt,dd,ul,ol,li
text formatting elements 文本格式元素：pre
form elements表单元素：form，fieldset，legend，button，input，textarea
table elements 表格元素：th , td
img elements 图片元素：img
img{
border：medium none；
padding：0；
margin：0；
}
body，button，input，select，textarea{
font：12px/1.5 ‘宋体’,tahoma,Srial,helvetica,sans-serif;
}
h1,h2,h3,h4,h5,h6{font-size:100%;}
em{font-size:normal;}
ul,ol{list-style:normal;}
a{text-decoration:none;color:}
a:hover{text-decoration:underline:color:#f40;}
img{border:0px;}
table{border-collapse:collapse;border-spacing:0}

二：良好的命名习惯
请不要使用元素的特征（颜色、位置、大小等）来命名一个class或ID，您可以选择意义的命名如：
.navigation{}，.sidebar{}, .postwrap{}
另外还有一种情况，一些固定的样式，定义后就不会修改的了，那你 命名时就不用担忧刚刚说的那种情况，如：
.alignleft{float:left;margin-right:20px;}
.alignright{float:right;text-align:right;margin-left:20px};
.clear{clear:both;text-indent:-9999px;}

三：代码缩写
li{font-:1.2em/1.4em Arial,Helvetica,sans-serif;
padding:5px 0 10px 5px;
}
更多属性缩写，参考《常用css缩写语法总结》或者下载css-shorthand-Cheat-Sheat.pdf。

四：利用继承性
如果父元素中的多个字元素使用相同的样式，那最好把他们相同的样式定义在其父元素上，让它们继承这些css样式。
.container li{font-family:Georgia,serif；}
.container p{font-family:Georgia,serif；}
.container h1{font-family:Georgia,serif；}
就可简写为：
.container{font-family:Georgia,serif；}

五：使用多重选择器
如果多个选择器有共同的样式的话，可以合并，这样做代码不但简洁，还能为你节省空间。如：
h1,h2,h3{font-family:Georgia,serif；}

六：适当的代码注释
/1、Reset 2、Header 3、Content 4、SiderBar 5、Footer/
如此你的代码结构一目了然

七：给你的Css代码排序

八：保持CSS的可读性

九：选择更优的样式属性值
CSS中有些属性采用不同的属性值，虽然达到的效果差不多，性能上query存在着差异，如：
border：0虽然在页面上看不见，但按照border默认值理解，浏览器依然对border-width/border-color进行了渲染，即已经占用了内存值。
而border：none，none即没有，浏览器解析“none”时将不会做出渲染动作，即不会消耗内存值。所以建议使用border：none；
同样的，display：none隐藏对象浏览器不做渲染，不占用内存。而visibility：hidden则会。

十：使用代替@import
@import不属于XHTML标签，也不是WEB标准的一部分，它对于早期的浏览器兼容也不高，并对网站的性能有某些负面的影响。具体可以参考《高性能网站设计：不要使用@import》

十一：使用外部样式表

十二：避免使用CSS表达式

十三：代码压缩