CSS（全称CascadingStyleSheets，层叠样式表）为开发者提供了一种声明式的样式语言，这是前端必备技能之一。基于网上全面的资料和简单易懂的语法，CSS非常容易学习，但其知识点广泛而分散，难以掌握。在我们日常的开发中，受限于原始代码的混乱和DDL的方式，我们往往忽略了CSS代码的质量，很容易写出乱七八糟的CSS文件。代码优化建议1.使用缩写属性来简化代码适用于：margin,padding,border,font,background等但并不是所有的情况都必须缩写，因为当一个属性的值被缩写时，所有的item都会一直setonce，有时我们不想在value中设置某些项，这时候需要开发者自己判断。2.组合选择器使用“,（逗号）”连接多个选择器来定义共同的属性，既可以减小css文件的大小，又可以增加可读性。为了更容易定位问题，在逗号后加了一行。3.使用更多的语义词来命名类。当命名课程时，目标是“在您不怀疑之后发展的人”4.属性声明的顺序参考：stylelint[1]的bootstrap属性顺序[1]声明放在一起，按如下顺序排列：Positioning：定位相关，如position、top/bottom/left/right、z-index等Boxmodel：盒模型相关，如display、float、margin、Width/heightetc.Typographic：排版相关，如字体，颜色，line-height等Visual：视觉相关，如背景，颜色等Misc：其他，如opacity，animation等个人建议：可以属性数量多的时候参考这5个类别进行排序和排列，顺序不需要太纠结。.declaration-order{/*定位*/position:absolute;顶部：0；右：0；底部：0；左：0；z-指数：100；/*盒子模型*/display:block;;宽度：100px；高度：100px；/*Typography*/font:normal13px"HelveticaNeue",sans-serif;行高：1.5；颜色：#333；文本对齐：居中；-颜色：#f5f5f5；边框：1px实心#e5e5e5；边界半径：3px；/*Misc*/opacity:1;}5.使用&符号来引用父选择器&是Sass和Less中提供的语法糖，用来表示对父选择器的引用，在源码中被广泛使用antd设计代码。优点：非常适合写组件样式，减少很多重复的词。缺点：从HTML类名中查找对应样式的成本增加。header{.header-title{/*styles*/}.header-title:after{/*styles*/}.header-content{/*styles*/}}/*使用&引用优化代码
