sass

小知识：用过CSS3的都知道，CSS3没有变量，也不支持任何逻辑脚本。随着需求的增加，Sass诞生，目的在于使样式支持逻辑脚本，使程序猿们更高效的写样式，Sass脚本经过编译后，最终会转换成.css文件。Sass脚本有两种格式，分别是.sass和.scss，这两种格式的区别在于：.sass不使用大括号和分号。由于.scss的写法与.css更加相似，所以通常我们都使用.scss格式

安装ruby：
原因：

sass依赖于ruby环境，所以装sass之前先确认装了ruby，安装ruby的作用在于：它可以安装和更新sass。ruby官网下载地址： http://rubyinstaller.org/downloads/，直接下载“WITH DEVKIT”的版本，亦或者在我的网盘下载（64位）：链接：https://pan.baidu.com/s/1HeoCCkW4EQfw-wsnfT5zzg 提取码：5krf ，接着傻瓜安装。

安装后：

1.查看是否安装成功：

ruby -v

如能正确显示ruby版本号，表明安装成功。

2.安装gem源淘宝镜像：

gem sources --add https://gems.ruby-china.com/ --remove https://rubygems.org/

（安装gem出现问题请戳：https://gems.ruby-china.com/）

3.打印安装gem：

gem sources -l

成功打印：*** CURRENT SOURCES ***

                 https://gems.ruby-china.com/

安装sass：
gem install sass

gem install compass

安装成功后，同样可通过sass -v检测是否安装成功，若能显示版本号则表示安装成功。

Sass编译：
这步是实现.scss向.css格式转换的关键。进入到编译文件所在的目录底下，编译命令如下：

sass input.scss output.css

如需实现动态编译（只要.scss改变就会马上编译成.css文件），编译命令如下：

sass --watch input.scss:output.css

如果是多文件编译，编译对象也可以是文件目录：

sass --watch aa:dd或者sass --watch aa:cc/output.css

编辑出来的文件有四种排版可配置，分别是nested、expanded、compact和compressed。以expanded为例，配置时只需在命令行末尾加入–style expanded即可。

sass --watch input.scss:output.css --style expanded