文档介绍：WEB前端开发规范
WEB前端开发规范
WEB前端开发规范
目录
1、规范目的2、基本准则3、文件规范4、文件规范
5、html书写规范6、css书写规范
7、JavaScript书写规范8、图片规范9、注释规范
10、开发及测试工具约定11、其他规范12、CSSHack1
规范目的
为提高团队协作效率,便于后台人员添加功能及前端后期优化维护,输出高质量的文档,同是为网站有一个更好的前端架构，网站的发展及未来打好一个基础。本文档如有不对或者不合适的地方请提出来,
基本准则
符合web标准,语义化html,结构表现行为分离,,代码要求简洁明了有序,尽可能的减小服务器负载,
、html,css,js,images文件均归档至约定的目录中;
、html文件命名:命名以中文命名，依实际模块命名，如果同一模块以_&title&_来组合命名,以方便添加功能时查找对应页面，团结里的相互理解。
例如：我的好股网里的TAB命名
、css文件命名:英文命名,，其他样式依实际模块页面需求命名，共用样式一般以模块考虑来划分命名,如有改版修改的css文件可以采用&_时间日期
例如：微博改版
、Js文件命名:英文命名,,、图片命名:4
html书写规范
、文档类型声明及编码:统一用;编码统一为。目的:统一性和网站提高开发合作效率。
、非特殊情况下样式文件必须外链至之间;非特殊情况下JavaScript文件必须外链至页面底部之前;目的:网站的优化。
、所有编码均遵循xhtml标准,标签&属性&属性命名必须由小写字母及下划线数字组成,且所有标签必须闭合,包括br(),hr()等;属性值必须用双引号包括;目的:更加符合web标准(w3c),也有利于seo。、充分利用无兼容性问题的html自身标签,比如span,em,strong,optgroup,label,等等目的：减少代码量
、语义化html,如标题根据重要性用h*(同一页面只能有一个h1),段落标记用p,列表用ul,内联元素中不可嵌套块级元素;目的：减少代码量，也有利于seo
、尽可能减少div嵌套,、给区块代码及重要功能(比如循环)加上注释,方便后台程序员嵌套模版;
、特殊符号使用:尽可能使用代码替代:比如)&空格()&()等等;、书写页面过程中,请考虑向后扩展性;5
css书写规范
-8;都用小写
:一般都使用class，特殊除外，,尽量使用简易的单词组合;命名方式参照《WEB前端开
发CSS命名参考》。命名方式采用驼峰命名法和划线命名法两种，提高可读性。例如：dropMenu、subNavMenu、drop-menu、sub_nav_menu。驼峰命名法用来区别不同的单词。划线命名法表明从属关系。如：“.timeList”和“.time_list”分别表示时间列表和时间部分下的列表。,建议遵循布局定位属性>自身属性>文本属性>
自身习惯书写,（比如：display,position,float,clear,visibility,table-layout等）（比如：width,height,margin,padding,border等）（比如：font,line-height,text-align,text-indent,vertical-align等）（比如：color,background,opacity,cursor,content,list-style,quotes等）
。#testspan｛｝和#｛｝尽量选择后者。采用继承属性还是新加
class根据不同情况灵活运用。新加class便于扩展维护。继承属性示例：这儿是标题列表201*-09-15样式表：{position:relative}{position:absolute;right:0},请务必转码成unicode码,以避