CSS Modules不是一个官方的规范，也不是浏览器的一种机制，而是在构建步骤中对CSS类名和选择器限定作用域的一种方式（类似于命名空间）。通过构建工具的帮助，可以将class的名字或者选择器的名字作用域化。
本教程操作环境：windows7系统、CSS3版、Dell G3电脑。 css modules是什么 根据CSS Modules在Gihub上的项目，它被解释为： 所有的类名和动画名称默认都有各自的作用域的CSS文件。
所以CSS Modules 不是一个官方的规范，也不是浏览器的一种机制，而是在构建步骤（例如使用Webpack或Browserify）中对CSS类名和选择器限定作用域的一种方式（类似于命名空间）。 css modules优势 解决全局命名冲突问题 css modules只关心组件本身 命名唯一 模块化 可以使用composes来引入自身模块中的样式以及另一个模块的样式 解决嵌套层次过深的问题 使用扁平化的类名 为什么引入css Modules？ 1）、全局样式冲突 webpack进行打包时，将所有js文件导入到入口App.js文件中，样式也会统一加载到入口中，根据css的layout规则，后面的样式会覆盖掉前面的样式声明，造成全局样式的覆盖问题。 2）、嵌套层次过深的选择器 嵌套特别深会造成的问题： - 根据css选择器的解析规则可以知道，层级越深，比较的次数也就越多，影响整个页面的渲染 - 增加了不必要的字节开销 - 语义混乱 可扩展性不好，约束越多，扩展性越差 3）、无法共享变量 复杂组件要使用 js 和 css 来共同处理样式。 学习视频分享：css视频教程 以上就是css modules是什么的详细内容，更多请关注模板之家(www.mb5.com.cn)其它相关文章！ |
