Web 前端代码规范

最后更新时间：2017-06-25

原始文章链接：

此项目用于记录规范的、高可维护性的前端代码，这是通过分析 Github 众多前端代码库，总结出来的前端代码书写规范。

目录

1. 前端普适性规范

2. HTML 规范

   立即学习“前端免费学习笔记（深入）”；

3. CSS 规范

4. JS 规范

License

public domain, Just take it.

Thanks

@Ruan YiFeng: 

@materliu：https://materliu.github.io/code-guide

@hzlzh: 

@tguide: 

前端普适性规范

黄金定律

永远遵循同一套编码规范，可以是这里列出的，也可以是你自己总结的。如果你发现本
规范中有任何错误，敬请指正。

不管有多少人共同参与同一项目，一定要确保每一行代码都像是同一个人编写的。

项目命名

项目名全部采用小写方式，以中划线分隔，禁止驼峰式命名。比如：my-project-name

文件命名

文件命名参照上一条规则，多个单词组成时，采用中划线连接方式，比如说: error-report.html

有复数结构时，要采用复数命名法，比如说： scripts, styles, images, data-models

文件名中只可由小写英文字母a~z、排序数字0~9或间隔符-组成，禁止包含特殊符号，比如空格、$等

为更好的表达语义，文件名使用英文名词命名，或英文简写。

不允许命名带有广告等英文的单词，例如ad,adv,adver,advertising，防止该模块被浏览器当成垃圾广告过滤掉。任何文件的命名均如此。

• index.shtml 引导页&首页

• main.shtml 首页

• download.shtml 下载页面

• act.html 活动列表页面

• video.html 视频

• cdkey.html CDKEY页面

• base.css 基本样式

• layout.css 框架布局

• module.css 模块样式

• global.css 全局样式

• font.css 字体样式

• index.css 首页样式

• link.css 链接样式

• print.css 打印样式

HTML 规范

语法

使用四个空格的缩进，这是保证代码在各种环境下显示一致的唯一方式。

嵌套的节点应该缩进（四个空格）。

在属性上，使用双引号，不要使用单引号。

不要在自动闭合标签结尾处使用斜线 - HTML5 规范 指出他们是可选的。

不要忽略可选的关闭标签（例如， 和