全局变量和局部变量
sass貌似是没有局部变量，和less区别就在于全局变量和局部变量，其实都遵循了JS的思想，看两段代码：
var a = 1;
function() {
a = 2;
}
console.log(a); //2
var a = 1;
function() {
var a = 2;
}
console.log(a); //1
其实，sass 遵循的是第一段代码，less遵循的是第二段代码，到这里相信已经明白个大概了。
下面再看一段代码：
$color: #fff;
li {
$color: #ccc;
color: $color; //#ccc
}
a {
color: $color; //#ccc
}
实际上， li 中的 $color 充当了全局变量，所以 a 中的 $color 引用了这个全局变量。但是，在 sass 中还是有局部变量的。看下面一段代码：
li {
$color: #fff;
color: $color; //#fff
}
a {
color: $color; //未定义
}
变量默认值 !default
$color: #fff;
$color: #ccc !default;
p {
color: $color; //#fff
}
正常的变量编译方式是从上往下，后面的覆盖前面的；!default打破了这个规则，它使用最前面定义的变量。关于 !default的理解，一言两句说不出来，详细可见这篇文章
特殊变量
$direction: top !default;
.#{$direction} {
border-top: 1px solid #ccc;
}
特殊变量使用#{}操作符。
多值变量
$linkColor: red blue !default;
a{
color: nth($linkColor, 1);
&:hover {
color: nth($linkColor, 2);
}
}
可以通过nth($var, index)函数取值。
$heading: (h1: 1px, h2: 2px, h3:3px);
@each $header, $size in $heading {
#{header} {
font-size: $size;
}
}
可以通过map-get($map, $key)取值。
关于更多函数可以参考sass Functions