背景介绍
规范,一个优秀的公司必然有一个优秀的团队,一个优秀的团队必然要有一个好的规范来约束和执行。国内基本各大互联网公司的前端都有自己的开发规范,但总的宗旨基本都是:代码简、易维护、性能高。对于一个大型项目经常会多人协作,这时必须要有一个好的规范才能顺利便捷地进行下去。
总而言之:不管有多少人共同参与同一项目,一定要确保每一行代码都像是同一个人编写的。
知识剖析
符合web标准,语义化html,结构表现行为分离,兼容性优良.页面性能方面,代码要求简洁明了有序,尽可能的减小服务器负载,保证最快的解析速度.
html规范
页面的第一行添加标准模式声明!DOCTYPEhtml
代码缩进:tab键设置四个空格(通常在软件右下角设置相应空格大小)
tml中除了开头的DOC和'UTF-8'或者head里特殊情况可以大写外,其他都为小写,css类都为小写
建议为html根元素指定lang属性,从而为文档设置正确的语言lang="zh-CN"
不同doctype在不同浏览器下会触发不同的渲染模式
非特殊情况下样式文件必须外链至(<head>… </head>)之间;非特殊情况下JavaScript文件必须外链至页面底部
尽可能减少div嵌套.
在页面中尽量避免使用style属性,即style="…";写在相应的样式文件中
对于属性的定义,确保全部使用双引号,绝不要使用单引号
背景图片请尽可能使用sprite技术,减小http请求
给区块代码及重要功能(比如循环)加上注释,方便后台添加功能。
不要使用@import,与<link>标签相比,@import指令要慢很多,不光增加了额外的请求次数,还会导致不可预料的问题。
常见问题
class命名有什么常用方式?
解决方案
在实际编程中,命名问题一直是很麻烦的问题,要想代码可读性高,维护方便,就必须规范命名。这里介绍几种命名方法
原子类命名规则
将复用性高的单条属性直接命名成类
扩展思考
原子类在网上争议非常大,原子类简单方便,但是不宜维护,控制困难。原子类其实不是一种工具,而是一种编写CSS的思想,即:抽出高度复用的样式模块,独立成一个原子类,为对应的模块添加。但是不宜过度使用,负责就和直接添加style没有区别了,在涉及数值方面我的建议时不要使用原子类,否则修改起来超级麻烦,可以使用less、sass等代替.
参考文献HTML+CSS日常编码规范
问题1:class命名有什么常用方式?
问题2:如何遵守哪些编码规范?
问题3:如何减少css的声明?