CSS 预处理器有什么优势？

2018-12-26

回答

CSS 预处理器添加了一些实用的原生 CSS 没有的的功能，并且他通过使用 DRY（Don't Repeat Yourself）原则使生成的 CSS 更加整洁和易于维护。他通过简洁的嵌套选择器语法减少了大量重复代码。变量、颜色函数（lighten,darken,transparentize 等）等附属工具，mixins 及循环使得 CSS 更像一个真正的编程语言，这使开发者编写复杂的 CSS 更加容易了。

加分回答

• CSS 预处理器虽然允许我们编写易于维护和可扩展的 CSS，但也存在一定的缺陷，如：需要安装、配置、编译等
• CSS 预处理器还包含文件切分、模块化、运算、函数等优势
• 目前主流的 CSS 预处理器有： Sass、Less、Stylus
• CSS 除了预处理器外还有后置处理器（Postprocessor），如：Autoprefixer 等
• CSS 变量虽然已被大多数浏览器支持，但语法及可用性都不如 CSS 预处理器。如：

:root {
  --global-color: #666;
  --pane-padding: 5px 42px;
}
.demo{
   color: var(--global-color);
}

返回总目录

每天 30 秒