CSS 预处理器是什么？一般来说，它们基于 CSS 扩展了一套属于自己的 DSL，来解决我们书写 CSS 时难以解决的问题：语法不够强大，比如无法嵌套书写导致模块化开发中需要书写很多重复的选择器；没有变量和合理的样式复用机制，使得逻辑上相关的属性值必须以字面量的形式重复输出，导致难以维护。所以这就决定了 CSS 预处理器的主要目标：提供 CSS 缺失的样式层复用机制、减少冗余代码，提高样式代码的可维护性。这不是锦上添花，而恰恰是雪中送炭。网上已经有不少对比目前最主流的三个预处理器 Less、Sass 和 Stylus（按字母顺序排名）的文章了，但是似乎都不是很详细，或者内容有些过时。下面我会更详细地探讨一下这三种预处理器的特性和它们的差异。

发挥CSS预处器的作用是一种很有挑战性的事情。CSS预处器有不同的语言，有不同的语法和功能。在这篇文章中,我们将介绍三种不同CSS预处器的蛮量、功能以及他们的好处——Sass、LESS和Stylus 。CSS预处理器是一种语言，用来编写一些CSS的特性,而且无需考虑浏览器兼容性的问题。CSS预处器有成千上万的特性。本文根据Johnathan Croom的《Sass vs. LESS vs. Stylus: Preprocessor Shootout》所译，让我们开始学习CSS的三种预处器对比。

Sass是一门非常优秀的CSS预处理语言，他是由Hampton Catlin创立，其中他还有另外一个名称SCSS，这个SCSS看起来更像CSS。最近迷上了CSS预处理器方面的东东，所以开始在针对性的学习Less、Sass和Stylus三个流行的预处器语言的基础知识，希望具有一定的基础后可以针对一些优秀的框架，研读他们的源码。所以今天给大家介绍的是Sass新手方面的指南。这篇文章是根据Andrew Chalkley的《The Absolute Beginner’s Guide to Sass》所译，希望这篇译文能帮助大家对Sass有一个概念性的了解，当然要深入的介绍的话，我想我们可以用一本书来描述，此处只是做引导性的学习，今后我也会加强这方面的分享，有兴趣的同学就观注一下相关更新吧，让我们一起来学习这几种CSS预处理器语言。更好的帮助大家开发CSS、维护CSS，从而提高自己的效率。

自从一个月前偶然发现Less之后我就开始坚定的使用它了。就CSS本身而言，对于我来说从来就不是问题，但是我很好奇的相法，使用变量来沿着一个调色板为我的网站或者模板创建一些东西。拥有一个提供固定数量给我选择的调色板，可以让我避免颜色太过跳跃，以致于从一个已定的风格中脱离。

昨天我在《CSS3 Gradient Buttons》介绍了如何使用CSS3的一些属性（特别是《CSS3 Gradient》）来制作Buttons。然而，制作一个基本的Buttons很简单，无外呼包括以下几步：

前面在《CSS——Bootstrap From Twitter》和《CSS——LESS》中介绍了Mark Otto（马克奥托）写的《BootStrap from twitter》以及Alexis Sellier写的LESS。

去年就初次接触了LESS,并用他制作了一个Less.org的首页页面，但由于CSS的固有模式，没有让自己喜欢上他。由于前段时间学习bootstrap from twitter再次让我接触了这个Less（我在《CSS——Bootstrap From Twitter》有简单的提到过Less），又发现了他的强大与方便，于是横下心来又重新开始学习Less。这次的学习中让我发现了他的更强大，从而也让自己更喜欢上了Less。