做了前端的这段时间中,整理整理我从渣渣到小白的规范。
/
/
/
ps--1 css 引入的时候
ps--2 命名规范
->项目命名
全部采取小写(eg:my_project_name);
->目录命名
参照项目命名的规则,要采用复数命名法(eg:style,script,deta_modles);
->JS文件命名
参照项目命名的规则;
->CSS,SCSS文件命名
参照项目命名的规则;
HTML命名
参照项目命名的规则;
ps--3 HTML结构
语法
在属性上使用双引号,不要使用单引号;
属性名称小写,用中划线做分隔符(除ID使用驼峰外,参考css规则)
属性顺序
属性顺序应该按照特性的顺序出现保证易读性;
ps--4 CSS
优先级
参考:
总结:尽量使用css设置样式,少用id。
同时保证html加载css文件时,第三方样式最先加载,画面最后加载
不要使用!important
这样就可以保证画面的样式覆盖公共的,公共的覆盖第三方的文件
命名
类名使用小写字母,以中划线分隔;
id采用驼峰样式
颜色
颜色使用16进制小写字母
颜色16进制尽量用简写
媒体查询
尽量将媒体查询的规则靠近与他们相关的规则,不要把他们放在一个单独的样式表中,或者丢在文件的底部,这样会让大家容易忘记他们,从而修改的时候会出现偏差。
杂项:
尽量少用‘*’选择器;
去掉小数点前面的0;
属性值‘0’后面不要加单位;
去掉数字中不必要的小数点和0;
不要再一个文件中出现两个相关的规则;
ps--5
引号
最外层统一使用单引号
变量命名
标准变量采用驼峰命名法,(除了对象的属性外,主要是考虑到cgi的返回数据);
常量全大写,用下划线链接;
构造函数,第一个字母大写;
JQuery对象必须以’$‘开头命名;
ps--6 编辑器设置
1.在HBuilder的整理代码格式设置中,使用默认配置[内置],并且不要修改其中的内容。
2.语法检验器全部打开