css规范
- 编码设置：UTF-8编码
- 缩进：使用2个空格为一个缩进层级
- 数值与单位：当属性值或颜色参数为 0 - 1之间的数时，省略小数点前的 0 ，当长度值为 0 时省略单位，十六进制的颜色属性值使用小写和尽量简写。
- 没有边框时，不要写成border:0，应该写成border:none
- 除了重置浏览器默认样式外，禁止直接为html tag添加css样式设置;
- 层级(z-index)必须清晰明确，页面弹窗、气泡为最高级（最高级为999），不同弹窗气泡之间可在三位数之间调整；普通区块为10-90内10的倍数；区块展开、弹出为当前父层级上个位增加。
- 选择器应该在满足功能的基础上尽量简短，减少选择器嵌套，查询消耗。但是一定要避免覆盖全局样式设置。
/* 侧边栏样式 */.sidebar { width: 1rem; float: left; border: none; height: .5rem;}.sidebar li, .menu-title { padding: 0 .2rem; font-size: .32rem; color: #1cc7b9; background: #fff;}复制代码 css命名规范：
- 一律采用小写加中划线的方式，不允许使用大写字母或 _;
- 规则命名避免使用中文拼音,不允许通过1、2、3等序号进行命名,不应该包含颜色（red/blue）、定位（left/right）等与具体显示效果相关的信息。应该用意义命名，而不是样式显示结果命名。
- 尽量不缩写，除非一看就明白的单词。
- id应该按需使用，而不能滥用,id用于标识模块或页面的某一个父容器区域，名称必须唯一，不要随意新建id
- 避免class与id重名
- 尽可能提高代码模块的复用，样式尽量用组合的方式
常用命名（多记多查英文单词）：page、wrap、layout、header(head)、footer(foot、ft)、content(cont)、menu、nav、main、submain、sidebar(side)、logo、banner、title(tit)、popo(pop)、icon、note、btn、txt、block、window(win)、tips等，如果遇到不常用的，可以借助翻译工具进行翻译取其英文命名。
css书写顺序
-
1.content 属性（如果有的话，应放在最前面）
-
2.位置布局：(position / top / right / bottom / left / z-index / display / float / ...)
-
3.盒模型：(width / height / padding / margin / border / overflow / ...)
-
4.文本排版：(font / line-height / text-align / word-wrap / ...)
-
5.视觉外观属性：(color / background / list-style / transform / animation / transition / ...)
-
如果使用CSS3的属性，并有必要加入浏览器前缀，则按照 -webkit- / -moz- / -ms- / -o- / std的顺序进行添加，标准属性写在最后。
-
链接的样式请严格按照如下顺序添加： a:link -> a:visited -> a:hover -> a:active
空格空行使用规范：
- 在规则声明块的左大括号 { 前加一个空格。
- +、>、~ 等选择器的两边各保留一个空格
- 在样式属性的冒号 : 后面加上一个空格，前面不加空格。
- 规则声明块的右大括号 } 独占一行。
- 每个规则声明间用空行分隔。
- 所有最外层引号使用双引号 " 。
- 多个selector共用一个样式集，则多个selector必须写成多行形式 ；
代码注释
代码注释，写在需要注释部分的前面
单行注释
星号与内容之间必须保留一个空格。
/* 单行注释：星号与内容之间必须保留一个空格 */复制代码
多行注释
星号要一列对齐，星号与内容之间必须保留一个空格。
/** * 多行注释：星号要一列对齐，星号与内容之间必须保留一个空格。 */复制代码
规则声明块内注释
使用 // 注释，// 后面加上一个空格，注释独立一行,写在需要注释部分的前面
.foo{ border: 0; // 注释独立一行: 背景色设置 background-color: #fff;}复制代码