什么是sass

Sass 是一款强化 CSS 的辅助工具，它在 CSS 语法的基础上增加了变量 (variables)、嵌套 (nested rules)、混合 (mixins)、导入 (inline imports) 等高级功能，这些拓展令 CSS 更加强大与优雅。

什么是scss

SCSS (Sassy CSS) ，在 CSS3 语法的基础上进行拓展，所有 CSS3 语法在 SCSS 中都是通用的，同时加入 Sass 的特色功能。

之间的区别

中文网上的解释如下：

Sass 有两种语法格式。首先是 SCSS (Sassy CSS) ，这种格式仅在 CSS3 语法的基础上进行拓展，所有 CSS3 语法在 SCSS 中都是通用的，同时加入 Sass 的特色功能。

另一种是最早的 Sass 语法格式，被称为缩进格式 (Indented Sass) 通常简称 "Sass"，是一种简化格式。

他们之间的区别：

• 文件后缀不同

  sass的文件后缀为.sass

  scss的文件后缀为scss

• 语法不同

  Sass采用缩进，与换行

  scss采用花括号与分号进行结尾

举个例子:

// sass
$width: 100px
$height: 20px
body
    width: $width
    height: $height

// scss
$widht: 200px;
$height: 30px;
body {
  width: $width;
  height: $height;
}

简单总结

可以认为scss是sass的扩展，scss完全兼容sass的全部特性，scss的写法很接近于css3，使用起来更顺手