1. 编码统一为 utf-8;

2. 协作开发及分工: i 会根据各个模块, 同时根据页面相似程序, 事先写好大体框架文件, 分配给前端人员

实现内部结构

表现

&行为; 共用 css 文件 base.css 由 i 书写, 协作开发过程中, 每个页面请务必都要引

入

, 此文件包含 reset

及头部底部样式

, 此文件不可随意修改;

3. class 与 id 的使用: id 是唯一的并是父级的, class 是可以重复的并是子级的, 所以 id 仅使用在大的模

块上

, class 可用在重复使用率高及子级中; id 原则上都是由我分发框架文件时命名的, 为 JavaScript 预留

钩子的除外

;

4. 为 JavaScript 预留钩子的命名, 请以 js_ 起始, 比如: js_hide, js_show;

5. class 与 id 命名: 大的框架命名比如 header/footer/wrapper/left/right 之类的在 2 中由 i 统一命名.

其他样式名称由

小写英文 & 数字 & _ 来组合命名, 如 i_comment, fontred, width200; 避免使用中

文拼音

, 尽量使用简易的单词组合; 总之, 命名要语义化, 简明化.

6. 规避 class 与 id 命名(此条重要, 若有不明白请及时与 i 沟通):

a, 通过从属写法规避, 示例见 d;

b, 取父级元素 id/class 命名部分命名, 示例见 d;

c, 重复使用率高的命名, 请以自己代号加下划线起始, 比如 i_clear;

d, a,b 两条, 适用于在 2 中已建好框架的页面, 如, 要在 2 中已建好框架的页面代码<div id=”mainnav”
></div>中加入新的 div 元素,

按

a 命名法则:

<div id=”mainnav”><div class=”firstnav”>…</div></div>,

样式写法

#mainnav .firstnav{…….}

按

b 命名法则:

<div id=”mainnav”><div class=”main_firstnav”>…</div></div>,

样式写法

.main_firstnav{…….}

7. css 属性书写顺序, 建议遵循

–

布局定位属性

–

自身属性

–

文本属性

>其他属性. 此条可根据自身习惯

书写

, 但尽量保证同类属性写在一起. 属性列举: 布局定位属性主要包括:

margin、padding、float（包

括

clear）、position（相应的 top,right,bottom,left）、display、visibility、overflow

等；

自身属

性主要包括

width 、height 、background 、border;

文本属性主要包括：　

font、color、text-

align、text-decoration、text-indent

等；其他属性包括

list-style(列表样式)、vertical-

vlign、cursor　、z-index(层叠顺序) 、zoom

等

. 我所列出的这些属性只是最常用到的, 并不代表全部;

8. 书写代码前, 考虑并提高样式重复使用率;

9. 充分利用 html 自身属性及样式继承原理减少代码量, 比如:

<ul class=”list”><li>这儿是标题列表<span>2010-09-15</span></ul>

定义

ul.list li{position:relative} ul.list li span{position:absolute; right:0}

即可实现日期居右显示

10. 样式表中中文字体名, 请务必转码成 unicode 码, 以避免编码错误时乱码;

11. 背景图片请尽可能使用 sprite 技术, 减小 http 请求, 考虑到多人协作开发, sprite 按模块制作;

12. 使用 table 标签时(尽量避免使用 table 标签), 请不要用

width/ height/cellspacing/cellpadding

等

table 属性直接定义表现, 应尽可能的利用 table 自身私有属性分离结构与表现, 如

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 文件中我会初始化表格样式)

13. 杜绝使用

<meta http-equiv=”X-UA-Compatible” content=”IE=7″ />

兼容

ie8;