发表于： 2019-03-02 20:37:07
1 683
今天完成的事情：（一定要写非常细致的内容，比如说学会了盒子模型，了解了Margin）
less的常用用法：
匹配模式
匹配模式就是这种可以随便定制的东西，其实理解起来也很简单，括号里多一个命名而已，比如调用这个.btn(no_border,#55E276); 表示无边框样式，背景色为#55E276(注意，命名是没有@符号的)，如果调用.btn(border,#E65151); 表示有边框样式，背景色为#E65151，具体写法如下
.btn(@_,@color){ //不同命名的公共部分要这样写，必须是@_，表示公共部分
width:120px;
height:30px;
line-height:30px;
border-radius:15px;
color:#fff;
font-size:14px;
text-align:center;
background:@color; //用参数表示
cursor:pointer;
}
.btn(no_border,@color){
//可以直接这样放着，或者写个border：none 这里的列子举得不好，如果换成左浮动右浮动，或者绝对定位的上下左右，应该更好点
}
.btn(border,@color){
border:1px solid #ccc;
}
.btn(border); //表示默认背景色有边框，边框颜色也可以写个参数进去
.btn(border,#E65151)//表示背景色#E65151，有边框
开发过程中应该遵守哪些编码规范和class命名规范？
css规范
排版规范
1、如果是在html中写内联的css，则必须写成单行
2、每一条规则的大括号{前后加空格
3、属性名冒号之前不加空格，冒号之后加空格
4、每一个属性值后必须添加分号，并且分号后加空格
5、多个selector共用一个样式集，则多个selector必须写成多行形式
class命名
1、规则命名中，一律采用小写加中划线的方式，不允许使用大写字母或_
2、命名避免使用中文拼音，应该采用更简明有语义的英文单词进行组合
3、不允许通过1、2、3等序号进行命名；避免class与id重名
4、class用于标识某一个类型的对象，命名必须言简意赅
5、尽可能提高代码模块的复用，样式尽量用组合的方式
6、规则名称中不应该包含颜色（red/blue）、定位（left/right）等与具体显示效果相关的信息。应该用意义命名，而不是样式显示结果命名
CSS书写规范
1、CSS有些属性是可以缩写的，比如padding,margin,font等等，这样精简代码同时又能提高用户的阅读体验。
2、去掉小数点前的“0”
3、简写命名——很多用户都喜欢简写类名，但前提是要让人看懂你的命名。
4、16进制颜色代码缩写——有些颜色代码是可以缩写的，我们就尽量缩写吧，提高用户体验为主。
5、长名称或词组可以使用中横线来为选择器命名。
6、不要随意使用Id——id在JS是唯一的，不能多次使用，而使用class类选择器却可以重复使用，另外id的优先级优先与class，所以id应该按需使用，而不能滥用。
明天计划的事情：（一定要写非常细致的内容）
继续完成任务
遇到的问题：（遇到什么困难，怎么解决的）
暂无
收获：（通过今天的学习，学到了什么知识）
同今天完成的任务
返回列表
评论