对于css的简化属性

Posted 2021-12-10 tmode

开发中高效才是王道，用少量的代码去做相同的事，好比高铁跟火车，你坐高铁都出国了，我这边才刚出省，这个不了解的话真的是伤不起~在开发中高效的代码可以节省一部分开发时间，减少代码量，节省服务器读取效率，当然简写属性更潇洒；但是不要乱用哦，简写属性会覆盖上面设置的值哦；

我用下面代码举例;

 Background-color ：red；//设置背景颜色
 Background-requer ：no-requer ；//设置背景是否重复
 Background-position：center center；//设置背景位置
 Background-size:2rem 2rem;//设置背景大小

 

上面代码完全可以简化成

Background：url() no-requre center/2rem 2rem；

 

甚至可以设置多张背景图片只需要加上，隔开即可，（background可以设置多重属性）代码如下

Background：url（0） no-requre center，
 url（1） no-requre center，
 url（2） no-requre center；

 

下面是一些其他属性的简化属性

font：font-style font-variant font-weight font-size/line-height font-famiy
 border：1px solid red，1px solid red，1px solid red，1px solid red；
 margin：1px 1px 1px 1px；//margin的上右下左

 

不要想了，最常用的简写属性已经没有了；

简写属性可以节省大部分开发时间跟，提高工作效率，
如果你想到了一个常用的简写属性欢迎评论打脸；