一、Html规范
1 、 基本准则
符合web2.0标准，语义化html，结构、表现、行为三层分离，兼容性优良， 代码简洁明了有序，尽可能的减少服务器负载，快速的解析速度。
2、 正确使用块级元素和内联元素嵌套
h1、h2、h3、h4、h5、h6、P、dt标签不能包含div等块级元素，只能包含内联元素。li可以嵌套div,ul,ol等块级元素，内联元素中不可嵌套块级元素。
3、<ul><li> 无序列表:在文章列表、导航条，下拉列表、tab使用。
4、<ol><li> 有序列表：文章列表等根据需要使用。
5、<dl><dt> 表示术语或定义，用来定义列表是很不错的选择，懂得结合使用
<dl>
<dt>标题</dt>
<dd>内容1</dd>
<dd>内容2</dd>
</dl>
6、 加粗时，可以使用<strong>标签，粗体， 表示关键词强调的语义化，有助于SEO。
7、 不宜过多使用加粗标签<b>， 不建议使用<br/>，用margin进行控制。
8、 p标签定义段落,用来区分段落，有语义化的，文章正文使用p标签是理所当然的，
推荐在文章或者文本段落以外的地方尽量少用P标签，不宜用来大范围的布局。
9、 语义化html, 如 标题根据重要性用h*(同一页面只能有一个h1)。
10、 所有编码均遵循xhtml标准, 标签 & 属性 & 属性命名 必须由小写字母及下划线
数字组成, 且所有标签必须闭合, 包括br (<br />), hr(<hr />)等; 属性值必须用双
引号包括;
11、 尽可能减少div多层嵌套。
12、 特殊符号使用: 尽可能使用代码替代: 比如 >(>) 、 空格( ) 等;
13、 html元素添加自定义属性的时候, 首先要考虑下有没有默认的已有的合适标签去
置，如果没有，可以使用须以“data-”为前缀来添加自定义属性，避免
用”data:”等其他命名方式。
14、 书写链接时，为了避免重定向，例如：href=“http://www.333xin.com/”，即需在URL 地址后 面加上“/”;
15、 在html页面中尽量避免直接使用style属性给标签加样式，做到内容与表现分离。
16、 尽量避免使用table标签，能不用就尽量不使用，在特定需要场景可以使用，如果使用table标签时，请不要用width、height、cellspacing、cellpadding等table属性直接在table上定义表现，应尽可能的利用table自身私有属性分离结构与表现，如：thead、tr、th、td、tbody、foot；
而cellspaing及cellpadding的css控制方法如下：
table{border:0; margin:0; border-collapse:collapse;}
table th, table td{padding:0;}
17、 不要使用<meta http-equiv=”X-UA-Compatible” content=”IE=7″ />和<meta http-equiv=”X-UA-Compatible” content=”IE=EmulateIE7″ >来达到 兼容ie8的目的。
18、 多余代码, 比如页面注释掉不需要的代码，应该坚决删除掉。
19、在img明确宽度和高度时，指定页面图片的尺寸（不要通过指定尺寸来缩放图片），对页面渲染速度有益。
20、充分利用无兼容性问题的html自身标签，比如span、strong、label等。
二、css规范
1、 能以背景形式呈现的图片, 尽量写入css样式中;
3、 背景图片请尽可能使用sprite技术，减小http请求，考虑到多人协作开发，sprite按模块制作。
4、 链接的样式请严格按照：a:link -> a:visited -> a:hover -> a:active（LVHA）的顺序写。
a:link 链接平常的状态
a:visited 链接被访问过之后
a:hover 鼠标放到链接上的时候
a:active 链接被按下的时候
5、 合并 margin、padding、border 的设置，尽量使用缩写法,比如margin:0 10px 0 10px;
6、 选择器应该在满足功能的基础上尽量简短，减少选择器嵌套，查询消耗。但是
一定要避免覆盖全局样式设置。
7、 如果没有边框时，不要写成 border:0，应该写成 border:none;
8、 在保持代码解耦的前提下，尽量合并重复的样式，例如：
a { display:block }
span{ display:block }
合并：a,span { display:block }
9、 background、font 等可以缩写的属性，尽量使用缩写形式
background: color image repeat attachment position;
font: style weight size/lineHeight family;
10、不要直接为 html 标签添加 css 样式，比如
div {
width: 100px;
｝
12、尽量少用 hack，能不hack 就尽量不用 hack，为了兼容必须需要时就使用。
13、尽量少用!important。
14、为了 SEO 和页面可用性，请使用 text-indent 来隐藏文本内容。
15、不要在 html 中加入标签来清理浮劢，通过在浮动元素的父元素上添加.clearfix 来
清除浮动
.clearfix:dfter{content:”.”; display:block;height:0;visibility:hidden;clear:both;}
.clearfix{zoom:1}
16、字体名称最好映射成对应的英文名，例如：黑体(SimHei) 宋体(SimSun) 微软雅黑(Microsoft Yahei);
17、css属性书写顺序, 建议遵循 布局定位属性–>自身属性–>文本属性–>其他属性. 此条可根据自身习惯书写，但尽量保证同类属性写在一起。属性列举：
布局定位属性主要包括： float、clear、position、top、right、bottom、left、display、visibility、overflow等；
自身属性主要包括：width、height、margin、padding、background、border；
文本属性主要包括：font、color、text-align、vertical-align、text-decoration、text-indent、white-space等；
其他属性包括：list-style、cursor、 z-index、zoom等。
18、不需要重复定义可继承的值，CSS中，子元素自动继承父元素的属性值，象颜色、字体等，已经在父元素中定义过的，在子元素中可以直接继承，不需要重复定义，除非是为了更变当前元素样式不使用父元素的属性值，但是要注意，浏览器可能用一些默认值覆盖你的定义。
19、尽量避免使用css表达式，css表达式仅在ie浏览器下才起作用，微软已在ie8后不推荐使用，在特定场景确实需要时使用，推荐少用。
20、 用png图片做图片时，要求图片格式为png-8格式,若png-8实在影响图片质量或其中有半透明效果，请为ie6单独定义背景：
_background:none;
_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=crop, src=’img/bg.png’);
2、css命名规则书写规范
1、CSS 样式文件中的所有的代码都应该小写, 如果是 16 进制（#AABBCC）表示颜色，则颜色取值应该大写。如果可以，颜色尽量用三位字符表示，比如:#333333; 可以这样写#333；
2、css规则命名中，推荐采用小写字母加中划线的方式和驼峰式写法，不允许使用大写字母。
3、命名尽可能地使用有语义的更简明的英文单词进行组合，能不用中文就尽量不使用中文。
4、命名注意缩写，不宜过长，但是也不能盲目缩写。
5、避免 class 跟 id 重名。
6、id 用于标识模块或页面的某一个父容器区域，名称必须唯一。
7、尽可能提高css代码模块的复用性和通用性。
8、规则名称中，颜色（red）和left\right，不要直接用来命名，
.red{color:red} , .left {width:500px;} （不推荐）
可以使用 .error-news{color:red}, .ff3300{color:#ff3300} ,
.content-left{ width:500px;}（正确推荐）
9、文件命名
common.css 通用的
base.css 基本共用的
layout.css 布局，版面
themes.css 主题
columns.css 专栏
font.css 文字
forms.css 表单
module.css 模块
三、javascript规范
1、 js每行代码结束时必须有分号;
2、 引用js库文件，文件须包含库名称及版本号，以及是否为压缩版，比如jquery.1.81.min.js；引用插件，文件名为库名+插件名称，比如jquery.cookie.js。
3、变量命名: 驼峰式命名. 原生JavaScript变量要求是纯英文字母, 首字母须小写, 如myName;
4、 避免全局变量.
5、函数命名: 首字母小写驼峰式命名. 如myName ();
6、命名语义化, 尽可能利用英文单词或其缩写;
7、页面引用js文件和js代码放在html代码的最底部。
四、图片使用类规范
1、 图片格式仅限于gif || png || jpg;
2、 如果背景图片有动画，则保存成 gif, 如果没有动画，也没有半透明效果，则保存成 png-8。
3、 如果有半透明效果，则保存成 png-24，但尽量避免使用半透明的png图片。
4、 重要图片必须加上alt属性，给重要的元素和截断的元素加上title。
5、命名全部用小写英文字母 || 数字 || _ 的组合，尽量用易懂的词汇，便于团队其他成员理解，命名分头尾两部分， 用下划线隔开， 比如ad_left01.gif || btn_submit.gif。
6、在保证视觉效果的情况下选择最小的图片格式与图片质量, 以减少加载时间。
7、运用css sprite技术集中小的背景图或图标, 减小页面http请求。
五、注释规范
1、 html注释: 注释格式 <!–这儿是注释–>, ’–’只能在注释的始末位置,不可置入注释文字区域;
2、 css注释:
单行注释： /*中文说明*/;
有修改者模块注释/* module: module by ysw 2013-05-30 */
3、 JavaScript注释,
1.1、单行注释使用 //这儿是单行注释。
1.2、多行注释使用 /* 这儿有多行注释 */。
