--- sidebar: auto --- # 编码规范 ## 编码 文件统一编码UTF-8编码，通过编辑器设置。 html中通过meta标签设置，即 `` css样式表中，头部添加 `@charset “utf-8”`，正常情况 css 文件不需要设置 charset，因为默认就是 utf-8，但是为了保险起见，统一设置。 ```css @charset "utf-8"; /* HTML5 Reset :: style.css ---------------------------------------------------------- We have learned much from/been inspired by/taken code where offered from: Eric Meyer :: http://ericmeyer.com HTML5 Doctor :: http://html5doctor.com and the HTML5 Boilerplate :: http://html5boilerplate.com ---------------------------------------------------*/ ``` ## 命名 对于普通文件和文件夹统一驼峰命名，即除了第一个单词首字母小写之外，其余的后面的全部单词额首字母为大写。 对于核心文件和文件夹统一帕斯卡命名，即所有单词的首字母大写。 ## 编辑 结构、数据、行为分离 文档或者模板中只包含结构即html代码，css样式及js全部通过外联方式引入，保证代码分离，便于维护。 css用法大概有如下四种方式： ```css

内联样式

嵌入样式

@import url('地址'); ``` 优先级是嵌入样式高于内联样式，内联样式高于外联样式。嵌入样式的优先级比外联样式的id的优先级都高。所以为了避免样式冲突、混淆、便于维护，尽量不要使用内联和嵌入式方式。 css样式文件全部放在 `` 标签上面加载，如下： ```html study ``` js文件全部放在上面进行加载，如下： ```html ``` 当然并不是所有的js都必须要放在``之上，比如有些第三方异步统计，第三方框架，或者是一些用于计算的js等。 ## 缩进 统一四个空格进行缩进，编辑器都可以进行换行缩进配置，使用Tab键进行缩进，不允许空格与Tab同时使用。 ## 大小写 在html和css中，标签名称、属性名称、属性值不区分大小写，在使用的过程中全部使用小写字母，不允许使用大写字母或者混合写法。 以下这些写法都是可以的，但是不允许这么写: ```html
hello
这是测试问题吗
``` 注意一点Class、ID的名称是大小写敏感的。比如`.btn-touch`与`.Btn-touch`是两个不同的class。 ## 引号 不论是html、js或者是css对于双引号和单引号都没有区别，那么在使用过程中，统一一律使用双引号，不能单引号和双引号混用（拼接等情况除外）。 ## HTML基础规范 ### 注释 在每个大的功能点上方进行注释。 ```html <-- do something -->
...
<-- do something end--> ``` ### DOCTYPE 为每个 HTML 页面的第一行添加标准模式（standard mode）的声明，这样能够确保在每个浏览器中拥有一致的展现。 ```html ``` ### 引入css和js文件 根据 HTML5 规范，在引入 css 和 js 文件时一般不需要指定 type 属性，因为 `text/css` 和 `text/javascript` 分别是它们的默认值。 ```html ``` ### IE兼容模式 IE 兼容模式优先使用最新版本的 IE 和 Chrome 内核 ```html SEO 优化 Style Guide ``` ### 标签 标签分为闭合标签与自闭合标签。 闭合标签，如`
、`等。 自闭合标签，如`、
、`等，这些自闭合标签在使用的过程中，全部不使用“/”来闭合，即： ```html ``` ### 嵌套 尽可能的减少标签的使用，减少嵌套的层级，在允许的情况下，尽量多使用after，before这一类的伪元素。 关于嵌套规则，分为严格嵌套和语义嵌套: inline-Level 元素，仅可以包含文本或其它 inline-Level 元素; ``里不可以嵌套交互式元素`、