On this page

介绍

什么是 CSS 预处理器

CSS 预处理器定义了一种新的语言，其基本思想是，用一种专门的编程语言，为 CSS 增加了一些编程的特性，将 CSS 作为目标生成文件，然后开发者就只要使用这种语言进行编码工作。
通俗的说，“CSS 预处理器用一种专门的编程语言，进行 Web 页面样式设计，然后再编译成正常的 CSS 文件，以供项目使用。CSS 预处理器为 CSS 增加一些编程的特性，无需考虑浏览器的兼容性问题”，例如你可以在 CSS 中使用变量、简单的逻辑程序、函数（如右侧代码编辑器中就使用了变量 $color）等等在编程语言中的一些基本特性，可以让你的 CSS 更加简洁、适应性更强、可读性更佳，更易于代码的维护等诸多好处。

CSS 预处理器的特点

基于 css 的另一种语言
通过工具编译成 CSS
添加了很多 CSS 不具备的特性
能提升 CSS 文件的组织

CSS 预处理器的作用

帮助更好地组织 CSS 代码
提高代码复用率
提升可维护性

CSS 预处理器的优缺点

优点：提高代码复用率和可维护性
缺点：需要引入编译过程有学习成本

CSS 预处理器的能力

变量和计算减少重复代码
嵌套反映层级和约束
Extend 和 Mixin 复用代码片段
循环适应于复杂有规律的样式
import CSS 文件模块化 A

CSS 预处理器的语言

Sass (SCSS)
LESS
Stylus
Turbine
Swithch CSS
CSS Cacheer
DT CSS

到目前为止，在众多优秀的 CSS 预处理器语言中就属 Sass、LESS 和

Stylus 最优秀，讨论的也多，对比的也多。

CSS 预处理器的框架

Less Lesshat EST http://ecomfe.github.io/est/
sass-Compass
提供现成的 mixin
类似 JS 类库封装常用功能