Sass作为一门具有编程性质的CSS扩展语言，它具有独立的文件名称，因为其历史原因，它的后缀名可以有两个选择，分袂为sass和scss，此中sass的编写格局不切合CSS编程语规则范，其不能使用大括号和分号，，需要的严格的缩进来做定界。如下所示：

body

background: #eee

font-size:12px

p

background: #0982c1

scss完全切合CSS语法，我们可以直接使用CSS语法，如下所示：

body {

background: #eee;

font-size:12px;

}

p {

background: #0982c1;

}

在前面笔者就重复强调，Sass只是用来生成CSS文件的，那么它的如何生成的呢？是通过sass的编译命令来进行的。最根基的编译命令语法如下：

sass文件名.scss

这种编译模式不会生成文件，会在命令行显示编译后的CSS代码，如图1所示：

图1  命令行编译

编译命令包罗多种模式，那么就由笔者来一次介绍：

1．生成指定文件名的编译方法

下面这条命令会在当前目录生成一个指定文件名的CSS文件名，如下所示：

sass文件名.scss:指定文件名.css

效果如图2所示：

图2  命令行编译

上图中我们不只生成了指定的css文件，并且还生成了两个特别的文件，此中sass-cache文件时编译孕育产生的缓存文件，可以删除；demo.css.map生存的是源文件demo.scss和编译后文件demo.css对应的关系表，在出产环境中我们只需要使用生成的css文件即可。

2.指定文件夹下所有文件编译

你还可以指定编译文件夹，好比你创建两个文件夹，分袂为sass和css，那么你只需要执行整个命令就能将指定的文件夹下的文件全部编译到指定的文件夹，效果如图3所示：

sass --update sass:css

图3  文件夹编译

Sass编译有四种模式，如表1所示：

表1  编译Sass文件的四种模式

那么我们就可以使用编译命令的附加参数“--style”指定模式进行编译，如下所示：

sass文件名.scss:文件名.css --style模式名

那么我们可以来测试一下效果：

可以看出来，nested模式仅仅是嵌套了缩进样式，将结尾的大括号提到代码的结尾部分。

可以看到expanded模式时连结了原样进行输出。

compact模式保存了注释，并且将单个选择器的CSS样式压缩成了一行。

compressed模式去除了注释，并且将所有代码缩进成了一行，这一种我们经常用于出产环境，可以有效的制止CSS文件过大，导致请求CSS资源时间过长的问题。