css书写规范
1:元素尽量使用class选择器匹配,对于特殊功能可以考虑使用 ID选择器。
2:明确各选择器的优先级,作用范围。
3:CSS写完之后必须使用“;”号结尾,虽然浏览器支持不用分 号结尾,但是不建议这么做。
4:除非编写HTML5页面,否则不允许使用CSS3伪类,如:
:nth-child(1)等伪类,禁止使用。
5:编写CSS样式时,不允许换行,样式必须一行写完,自动换行 除外。
6:对于子元素样式采用链选择器进行选择,如:
:btn-save div
7:元素选择器只能在定义全局CSS和子元素匹配时使用(尽量少 用),其他地方禁止使用。
8:请记住IE浏览器的hack方式,如下:
IE6 = _width:100px;
IE7 = *width:100px;
IE8 = width:100px\9;
IE8/9 = width:100px\0;
IE9 = width:100px\9\0;
9:: 编码统一为utf-8;
10: css属性书写顺序, 建议遵循: 布局定位属性-->自身属性-->文本属性-->其他属性: 此条可根据自身习惯书写, 但尽量保证同类属 性写在一起:
11: 书写代码前, 考虑并提高样式重复使用率;
12: 充分利用html自身属性及样式继承原理减少代码量, 比如:
Example Source Code [www:52css:com]
<ul class="list"><li>这儿是标题列表<span>2010-09- 15</span></ul>
定义
ul:list li{position:relative} ul:list li span{position:absolute; right:0}
即可实现日期居右显示
13: 样式表中中文字体名, 请务必转码成unicode码, 以避免编码错误时乱码;
14: 使用table标签时(尽量避免使用table标签), 请不要用width/ height/cellspacing/cellpadding等table属性直接定义表现, 应尽可能的利用table自身私有属性分离结构与表现 , 如
Example Source Code [www:52css:com]
thead,tr,th,td,tbody,tfoot,colgroup,scope;
(cellspaing及cellpadding的css控制方法:
table{border:0;margin:0;border-collapse:collapse;} table th, table td{padding:0;} ,
base:css文件中我会初始化表格样式)
15: 杜绝使用<meta http-equiv="X-UA-Compatible" content="IE=7" /> 兼容 ie8;
Example Source Code [www:52css:com]
_background:none;_filter:progid:DXImageTransform:Microsoft:AlphaImageLoader
(sizingMethod=crop, src=’img/bg:png’);
16: 避免兼容性属性的使用, 比如text-shadow || css3的相关属性;
17:减少使用影响性能的属性, 比如position:absolute || float ;
18:必须为大区块样式添加注释, 小区块适量注释;