SASS基础知识

1、编译成CSS工具–Koala，下载地址：http://koala-app.com/
2、建立CSS目录，例如在CSS目录创建index.scss.文件，把CSS目录直接拖到Koala中就可以，此时目录中会出现index.css.map和index.css文件，打开index.scss文件编写代码，编译自动进行，在文件index.css中。
3、sass支持css编码格式。

ul li a{    display:block;}

在index.css文件中显示：

ul li a {  display: block; }/*# sourceMappingURL=index.css.map */

4、支持嵌套模式：

ul{    li{        a{            display:block;        }    }}

在index.css文件中显示：

ul li a {  display: block; }/*# sourceMappingURL=index.css.map */

5、&符号表示上一级的标签内容：
e.g.1:

ul{    li{        a{            display:block;        }        &:hover{            color:red;        }    }}

index.css显示：

ul li a {  display: block; }ul li:hover {  color: red; }/*# sourceMappingURL=index.css.map */

e.g.2:

ul{    li{        a{            display:block;            &:hover{                color:red;            }        }    }}

index.css显示：

ul li a {  display: block; }  ul li a:hover {    color: red; }/*# sourceMappingURL=index.css.map */

6、支持变量的使用
格式：$+变量名

$color_h:#ccc;ul{    li{        a{            display:block;            color:$color_h;        }    }}a{    color:$color_h;}

index.css显示：

ul li a {  display: block;  color: #ccc; }a {  color: #ccc; }/*# sourceMappingURL=index.css.map */

7、默认是不支持中文的。
比如：

boay{    font-family:"微软雅黑";}

会报错。修改如下：
1)找到安装路径，找到此文件：

打开文件，添加：Encoding.default_external = Encoding.find(‘utf-8’)

保存，再试，就可以了。
index.css显示：

@charset "UTF-8";boay {  font-family: "微软雅黑"; }

8、Koala 编译器配置：