CSS 预处理器定义了一种新的语言,其基本思想是，用一种专门的编程语言，为 CSS 增加了一些编程的特性，将 CSS 作为目标生成文件，然后开发者就只需要使用该语言进行编码工作，大大提高了工作效率。而Sass作为CSS预处理器的一员无疑是其中的佼佼者。  

Sass 官网上是这样描述 Sass 的：Sass 是一门高于 CSS 的元语言，它能用来清晰地、结构化地描述文件样式，有着比普通 CSS 更加强大的功能。Sass 能够提供更简洁、更优雅的语法，同时提供多种功能来创建可维护和管理的样式表。世界上最成熟、最稳定、最强大的专业级CSS扩展语言。

Sass 是最早的 CSS 预处理语言，有比 LESS 更为强大的功能，不过其一开始的缩进式语法（Sass 老版本语法，后面课程会详细介绍 ）并不能被大众接受，不过由于其强大的功能和 Ruby on Rails 的大力推动，还是有很多开发者选择了 Sass。它在 CSS 基础上增加了变量 (variables)、嵌套 (nested rules)、混合 (mixins)、导入 (inline imports) 等功能，通过函数进行颜色值与属性值的运算，同时能够自定义输出格式。Sass 是采用 Ruby 语言编写的一款 CSS 预处理语言，它诞生于2007年，是最大的成熟的 CSS 预处理语言。最初它是为了配合 HAML（一种缩进式 HTML 预编译器）而设计的，因此有着和 HTML 一样的缩进式风格。虽然缩进式风格可以有效缩减代码量，强制规范编码风格，但它一方面并不为大多数程序员接受，另一方面无法兼容已有的 CSS 代码。这也是 Sass 虽然出现得最早，但远不如 LESS 普及的原因。

有着CSS基础的同学可能要提出心中的疑问，那么Sass和Scss有什么区别呢？实际上，Sass 和 SCSS 其实是同一种东西，我们平时都称之为 Sass，两者之间不同之处微乎其微：文件扩展名不同，Sass 是以“.sass”后缀为扩展名，而 SCSS 是以“.scss”后缀为扩展名；

语法书写方式不同，Sass 是以严格的缩进式语法规则来书写，不带大括号({})和分号(;)，而 SCSS 的语法书写和我们的 CSS 语法书写方式非常类似。为了方便大家理解，我们举个实例看看二者的区别：

Sass语法：

$font-stack: Helvetica, sans-serif  //定义变量
$primary-color: #333 //定义变量

body
  font: 100% $font-stack
  color: $primary-color

SCSS语法：

$font-stack: Helvetica, sans-serif;
$primary-color: #333;

body {
  font: 100% $font-stack;
  color: $primary-color;
}

但是它们编译出来的CSS都是一样的：

body {
  font: 100% Helvetica, sans-serif;
  color: #333;
}

SCSS 和 CSS 的写法无差别，这也是 Sass 后来越来越受大众喜欢原因之一。简而言之，把你现有的“.css”文件直接修改成“.scss”即可使用。

Sass基于Ruby语言开发而成，window下安装 sass 首先需要 安装Ruby。（注: mac下自带Ruby无需在安装Ruby!）先从官网下载Ruby，安装过程中请注意勾选 Add Ruby executables to your PATH添加到系统环境变量。Ruby 自带一个叫做 RubyGems 的系统，用来安装基于Ruby的软件。我们可以使用这个系统来 轻松地安装Sass和Compass。

Sass编译有很多种方式，如命令行编译模式、sublime插件SASS-Build、编译软件koala、前端自动化软件codekit、Grunt打造前端自动化工作流grunt-sass、Gulp打造前端自动化工作流gulp-ruby-sass等。

​  命令行编译模式指是Sass 命令行工具根据文件的拓展名判断所使用的语法格式，没有文件名时 sass 命令默认编译 .sass 文件，添加 --scss 选项或者使用 scss 命令编译 SCSS 文件。

sass的四种编译风格：

• nested：嵌套缩进的css代码，它是默认值。
• expanded：没有缩进的、扩展的css代码。
• compact：简洁格式的css代码（一种选择器的规则在单独一行）。
• compressed：压缩后的css代码。

​ Sass 允许将一套CSS样式嵌套进 另一套样式中，内层的样式将它外层的选择器 作为父选择器。嵌套功能 避免了重复输入父选择器，而且令复杂的 CSS 结构更易于管理。

想要了解更多的关于Sass的故事和知识可以登录Sass官网获取更多相关资讯，也可以观看本站的专业视频课程，深入学习更多CSS预处理器的知识。