上面的你要怎么样structure写css1.俄罗斯套娃，这个可以解决全球污染问题，只需要修改topparent的名字就可以开始新一波的套娃了。但是这样写的代码容易被骂，代码冗余，可读性差。box-container{color:#000;}.box-container.boxs{color:orange;}.box-container.boxs.box-item{color:yellow;}.box.boxs.box-item.item{color:green;}2.下面的代码很清晰，解决了冗余的问题，但是随着项目越来越大，命名是个问题，所以有很多奇怪的名字什么是预处理，老的不用说了，驱动的话，可以看看->传送门，这里有一些最流行的CSS预处理器：Sass，LESS，tylus，PostCSS预处理器增强CSS的语法。让标准CSS具备以下能力变量混合（Mixin）扩展嵌套规则计算功能Namespaces&Accessors（命名空间和访问器）作用域以上流行的预处理器就不一一介绍了，官方的后处理器很详细的介绍了它处理的对象with是标准的CSS，兼容性优化等操作不需要开发关注；最终的代码是以css代码为代表的插件，具有体积小、CSS3前缀等特点。CSS3属性前缀各个浏览器的CSSModules只是解决了编写代码时代码复用和手动嵌套的问题，并没有真正解决全局污染的问题说到CSS模块化，不得不提几个概念CSSInJSscope，你可以自学。我觉得CSSModules很简单，可以解决问题/*Button.css*/.primary{background-color:#1aad19;颜色：#fff；边框：无；border-radius:5px;}//Button.jsimportstylesfrom'./Button.css';console.log(styles);//->{primary:"yTXmm0isaXExoYiZUvKxH"}constButton=document.createElement('div')Button.innerHTML=`提交`导出默认按钮//索引.jsimportButtonfrom'./components/Button'constapp=document.getElementById('root')appHTML由.appendChild(Button)

生成提交