简单介绍一下5个css书写技巧:
1. CSS Reset/重置
已经了解了什么是css重置。那么怎么写css重置呢。
可以copy Eric Meyer Reset, YUI Reset或其它css reset, 要根据你的项目改为自己的reset.
不要使用* { margin: 0; padding: 0; } 。个人很爱用，有作者提到使用这句并不适用一些元素比如单选按钮。
2. 按字母顺序来排列css
不按字母顺序排的
复制代码 代码示例:
div#header h1 {
z-index: 101;
color: #000;
position: relative;
line-height: 24px;
margin-right: 48px;
border-bottom: 1px solid #dedede;
font-size: 18px;
}
按字母顺序排的
div#header h1 {
border-bottom: 1px solid #dedede;
color: #000;
font-size: 18px;
line-height: 24px;
margin-right: 48px;
position: relative;
z-index: 101;
}
原因这样可以更好的找到某个属性。我觉着这样比较好。
3. 更好的组织css结构
使用css注释来分给css分组，这样结构明了，也有利于协同设计。
复制代码 代码示例:
/*****Reset*****/
xxxxxxx{xxxxx}
xxxxx{xxxxx}
/*****layouts*****/
xxxxxxx{xxxxx}
xxxxx{xxxxx}
4. 保持一致性
不要纠结到底一个选择器的所有属性写在一行，还是每个属性写一行好。你自己觉得方便就可以。
复制代码 代码示例:
iv#header { float: left; width: 100%; }
div#header div.column {
border-right: 1px solid #ccc;
float: rightright;
margin-right: 50px;
padding: 10px;
width: 300px;
}
div#header h1 { float: left; position: relative; width: 250px; }
如果你喜欢写一行，发给team的另一个，却喜欢每排一行，把css拿去w3c验证，这样它会有一份结果，自动转换成每排一行。
5. 先标记后css
是对html的标记弄好后再写css会比较不容易出错。
