目前，较为出名的三大CSS预处理器：less、sass、stylus，相信大家都不陌生，很多项目都使用预处理器来编译CSS样式，比如 bootstrap。在 bootstrap 4.x 版本之前，都是使用 less 预处理器，但是在4.x版本之后，bootstrap 已经把 less 换成了 sass。。。
疑问：
既然有三款预处理器，那么哪一款预处理器更适合于我们呢？他们之间有什么差异呢？以下是我个人整理的特性对比表格，若有错误的地方，请发邮件至codes.artisan@gmail.com指出。
特性对比：
| 特性 | less | sass |
|---|---|---|
| 学习成本 | 低 | 略高 |
变量 * |
支持，以 @ 符号开头 |
支持，以 $ 符号开头 |
mixin * |
支持并以混合模式使用 | 支持（语法限定较为严格） |
嵌套规则 * |
支持 | 支持 |
运算 * |
支持 | 支持 |
| 逻辑判断 | 支持但不直观 docs | 支持且比较直观 docs |
| 循环 | 支持但不直观 docs | 支持且比较直观 docs |
| 默认变量 | 支持但比较麻烦 docs | 支持且简单易用 docs |
| 继承 | 支持 | 支持 |
| 变量作用域 | 全局 | 全局和局部 Understanding Variable Scope in Sass |
| 自定义函数 | 需要借助插件 less-plugin-functions | 支持 docs |
以上的表格仅为一些较大的差异，具体细节请查阅文档： less sass 。
结语：通过上面的表格对比，可以得出结论，less 学习成本低，但是在使用一些特性的时候，并不是那么直观（相对于编程中常用的语法来说：if else each 等），而 sass 学习成本相对于 less 来说学习成本更高一些，但是它的语法更直观、更贴近于现有的编程语言。