目录
1.背景介绍
2.知识剖析
3.常见问题
4.解决方案
5.编码实战
6.扩展思考
7.参考文献
8.更多讨论
前言
sass是css的预处理器，它提供了许多便利的写法方法
可以使用变量，常量，嵌套，函数，混合，继承等功能，让css的开发变得更加简单可维护。
直接写出来的sass文件其实就是普通的文本文件，以.sass或.scss作为文件后缀名。
里面可以直接使用css语法以及sass特有的语法特性，完成后通常需要经过编译成合法的css文件以供浏览器使用。
sass基于Ruby语言开发而成，因此安装sass前需要安装Ruby。（注:mac下自带Ruby无需在安装Ruby!）
window下安装SASS首先需要安装Ruby，先从官网下载Ruby并安装。安装过程中请注意勾选Add Ruby executables to your PATH添加到系统环境变量。
安装完成后需测试安装有没有成功,运行CMD输入以下命令：
ruby -v
安装成功会打印ruby 2.2.2p95 (2015-04-13 revision 50295) [i386-mingw32]
ruby安装完成后输入以下命令安装sass和compass
gem install sass gem install compass
安装完成后用如下命令来确认sass和compass的安装成功
sass -v
Sass 3.x.x (Selective Steve)
compass -v
Compass 1.x.x (Polaris)
Copyright (c) 2008-2015 Chris Eppstein
Released under the MIT License.
Compass is charityware.
Please make a tax deductable donation for a worthy cause: http://umdf.org/compass
命令行编译;
编译软件koala
使用vscode中的Live Sass Compiler插件来实现scss文件的实时编译
Sass 让人们受益的一个重要特性就是它为 CSS 引入了变量。你可以把反复使用的 CSS 属性值 定义成变量，然后通过变量名来引用它们，而无需重复书写这一属性值。
变量的定义是以$符号开头，加上变量名
见demo
变量的注意事项
1、变量需要提前声明才能使用，因为编译是从上往下进行的，如果在还未声明变量的地方使用，会找不到这个变量。
2、变量都是全局变量，如果在大括号内部定义的变量则属于局部变量。
通常所用到的选择器嵌套是这样的，将新的选择器放到父级选择器当中，并且可以无限多级嵌套。
见demo
如果存在两个class，他们有一些不同但又有许多相似之处，以前的做法可能是把所有样式重复声明两次。但是有sass之后更好的做法是创建一个基础的class，然后在第二个class中用@extend继承它，同时还可以添加一些额外的样式，或者对某些样式进行重写。比如我们之前学过bootstrap的按钮的构建思想，是对基础样式进行附加和重写，而现在想要定义自己的样式时就可以很方便地进行这一操作了。首先声明一个标准样式的class，然后继承这个样式，然后设置不同的主题色：
见demo
当出现大段大段重用样式代码时，独立的变量就难以应付，这个时候可以通过sass的混合器@mixin 和 @include 实现大段样式的重用。在定义mixin时，需要在前面添加@符号，使用时需要用@include来引用该@mixin：
见demo
导入规则可以从外部文件导入mixin混合器等等。在sass中有一个命名惯例，被导入的样式文件名用下划线做前缀。导入的语法是@import “xxx”，这里的xxx不需要带文件后缀和下划线前缀。也就是说导入“_style.sass”或者“_style.scss”的时候，只需要写@import “style”就可以了：
见demo
https://blog.csdn.net/chase_sky/article/details/73825796
讨论时间到，欢迎大家提问！
感谢大家观看
By 何岳