前端、HTML+CSS+JS编写规范（终极版）

jsyzchen 发布于2019-08-01 18:15 / 1332人阅读

摘要：文档规范和文档必须采用编码格式文档必须使用的标准文档格式编写规范和的标签属性类名都必须使用小写字母和的属性类名命名必须具有语义化代码必须保持文档结构清晰，必须合理的进行代码缩进文件禁止样式表内引用文件编写格式，样式代码保持一行，多个选择器

HTMLCSS文档规范

HTML和CSS文档必须采用UTF-8编码格式；

HTML文档必须使用HTML5的标准文档格式；

HTMLCSS编写规范

HTML和CSS的标签、属性、类名、ID都必须使用小写字母；

HTML和CSS的属性、类名、ID命名必须具有语义化；

HTML代码必须保持文档结构清晰，必须合理的进行代码缩进；

CSS文件禁止样式表内引用CSS文件；

CSS编写格式，样式代码保持一行，多个选择器同一个规则必须换行，如图1；

CSS样式表格分为3个级别：系统级（以lib_开头）、模块级（以m_开头）、页面级（以p_开头）；

修改系统级和模块级的文件必须经过前端主管审批；

模块级的样式必须以“m_”开头，例如头部模块应该命名为：m_header；

一个模块一个或多个CSS文件，禁止两个或以上模块使用同一个CSS文件；

页面级的样式必须以“p_”开头、或者外层以p_开头，例如：p_goodslist、p_goodslist .name；

页面级的样式如因特殊原因需要针对这个页面进行对模块级的样式进行重置的时候，须将重置样式写在最顶部；

除系统级文件外，禁止其他页面级和模块级的CSS文件进行系统的样式重置操作，模块级和页面级也禁止直接重置系统级的样式；

js文档规范

1.JavaScript文档必须采用UTF-8(不包括Unicode签名BOM)编码格式；

js编写规范

1.参数命名必须以小驼峰命名，私有（局部）变量尽量使用下划线开头；
2.每个变量必须使用var定义；
3.需编写适当的注释；
4.禁止定义以下保留名称Zepto、JSON、template、WdatePicker、KindEditor、LT、TP、LeiTing（自己部门定义的全局变量）
5.每一段代码必须以分号分割，例如：var a = 123; function(){};

全局变量模块 window["LeiTing"]

1.window["LeiTing"]["UI"]    //公共UI模块
2.window["LeiTing"]["Model"] //公共模块
3.window["LeiTing"]["PageData"] = [//页面数据

segmentfault上其他相关分享
前端编码规范
前端代码规范
编码规范-html
编码规范-css

GPU云服务器云服务器 html页面编写规范前端js编写工具终极版 js html规范

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/51609.html

前端、HTML+CSS+JS编写规范（终极版）

摘要：文档规范和文档必须采用编码格式文档必须使用的标准文档格式编写规范和的标签属性类名都必须使用小写字母和的属性类名命名必须具有语义化代码必须保持文档结构清晰，必须合理的进行代码缩进文件禁止样式表内引用文件编写格式，样式代码保持一行，多个选择器 HTMLCSS文档规范 HTML和CSS文档必须采用UTF-8编码格式； HTML文档必须使用HTML5的标准文档格式； HTMLCSS编写规范...

_Dreams 2019-08-22 11:23 评论0 收藏0
前端、HTML+CSS+JS编写规范（终极版）

摘要：文档规范和文档必须采用编码格式文档必须使用的标准文档格式编写规范和的标签属性类名都必须使用小写字母和的属性类名命名必须具有语义化代码必须保持文档结构清晰，必须合理的进行代码缩进文件禁止样式表内引用文件编写格式，样式代码保持一行，多个选择器 HTMLCSS文档规范 HTML和CSS文档必须采用UTF-8编码格式； HTML文档必须使用HTML5的标准文档格式； HTMLCSS编写规范...

Developer 2019-08-29 14:04 评论0 收藏0
前端构建工具整理

摘要：常见前端构建工具的分类和对比是附带的包管理器，是内置的一个功能，允许在文件里面使用字段定义任务在这里，一个属性对应一段脚本，原理是通过调用去运行脚本命令。前文端技术范围不断发展，前端开发不仅限于直接编写html，css和javascript，Web应用日益庞大，代码也更加庞大，因此许多新的思想（例如模块化和工程化等）和框架（React和Vue等），以及新的语言（Es6 TypeSc...

leo108 2019-08-23 10:53 评论0 收藏0
前端资源系列（4）-前端学习资源分享&前端面试资源汇总

摘要：特意对前端学习资源做一个汇总，方便自己学习查阅参考，和好友们共同进步。特意对前端学习资源做一个汇总，方便自己学习查阅参考，和好友们共同进步。本以为自己收藏的站点多，可以很快搞定，没想到一入汇总深似海。还有很多不足&遗漏的地方，欢迎补充。有错误的地方，还请斧正... 托管: welcome to git，欢迎交流，感谢star 有好友反应和斧正，会及时更新，平时业务工作时也会不定期更...

princekin 2019-08-20 11:28 评论0 收藏0
前端知识点总结——JQ

摘要：前端知识点总结什么是第三方的极简化的操作的函数库第三方下载极简化是操作的终极简化个方面增删改查事件绑定动画效果操作学习还是在学，只不过简化了函数库中都是函数，用函数来解决一切问题为什么使用操作的终极简化解决了大部分浏览器兼容性问题凡是让用的前端知识点总结——JQ 1.什么是jQuery: jQuery: 第三方的极简化的DOM操作的函数库第三方: 下载极简化: 是DOM操作的...

jayzou 2019-08-22 14:59 评论0 收藏0