HTML编码规范
来源:互联网 发布:加拿大木结构设计软件 编辑:程序博客网 时间:2024/05/21 22:44
github上找的百度总结的前端编码规范。
1、代码风格
》》缩进与换行。
【强制】使用四个空格作为一个缩进层级,不允许使用两个空格,或者Tab字符。
示例:
<ul> <li>first</li> <li>second</li> </ul>
【建议】每行不得超过120个字符。原因:过长的代码,不利于维护,但是考虑到HTML的特殊性,不做强制要求。
》》命名
【强制】class必须单词全字母小写,单词间以” - “ 分隔。
【强制】class必须代表相应模块或者部件的内容或功能。不得以样式信息进行命名。
示例:
<!-- good --><div class="sidebar"></div><!-- bad --><div class="left"></div>【强制】id必须保证页面唯一。原因:同一个页面中,不同的元素包含相同的id,不符合id的属性含义。并且使用document.getElementById()。时可能导致难以追查的问题。
【建议】id建议单词全字母小写,单词间以” - “分隔,并且同项目必须保持风格一致。
【建议】id、class命名,在避免冲突,并且描述清除的前提下尽可能短。
示例:
<!-- good --><div id="nav"></div><!-- bad --><div id="navigation"></div><!-- good --><p class="comment"></p><!-- bad --><p class="com"></p><!-- good --><span class="author"></span><!-- bad --><span class="red"></span>【强制】禁止为了hook脚本,创建无样式信息的CSS。
解释:不允许class只用于让JavaScript选择某些元素,class应该具有明确的语义和样式。否则容易导致CSS class泛滥。使用id、属性选择作为hook是更好的方式。
【强制】同一页面内,避免使用相同的name和id。
解释:IE浏览器会混淆元素的id和name属性。document.getElementById()时会获得不期望的元素。所以在对元素的id和name命名时要格外小心。
一个较好的实践方法是,name跟id采用不同的命名法。
示例:
<input name="foo"><div id="foo"></div><script>// IE6 将显示 INPUTalert(document.getElementById('foo').tagName);</script>
未完,会接着更新。
github链接:https://github.com/ecomfe/spec/blob/master/html-style-guide.md
0 0
- 编码规范系列:html规范
- HTML CSS 编码规范
- HTML 编码规范
- HTML&CSS编码规范
- bootstrap html编码规范
- HTML&&CSS编码规范
- HTML编码规范
- HTML编码规范
- html 编码规范
- html/css 编码规范
- HTML代码编码规范
- HTML编码规范
- HTML编码规范
- HTML编码规范
- HTML编码规范
- html编码规范
- HTML编码规范
- HTML&CSS编码规范
- p122第15题
- DNS BIND主辅同步部署
- 2015/4/18(2)
- 再读 K-Means
- poj1068
- HTML编码规范
- 向WCF服务提交Stream类型的数据
- Scala学习笔记
- Oracle数据库PL/SQL学习笔记——函数定义
- 安卓开发中用volley框架请时,中文返回乱码问题
- VI中的多行删除与复制 [转载]
- 想听懂用户的声音,至少得先学会数据分析吧
- 数学逻辑
- Mac下Lua Sublime Text2/3 开发环境搭建(补充)