SASS规则

1.嵌套

相当于css中的后代选择

2.$变量

3.@mixin函数名（参数）

相当于js中的函数的功能，就是将一小段代码进行封装，通过传递不同的参数达到不同的效果

使用 @include  函数名（参数） 方法对函数进行调用

4.@import

可以通过@import引入其它的scss文件，相当于将额外的scss文件复制到当前文件

5.@extend

字面意思是继承，就是防止将相同的代码写多份，直接继承之前写过的内容

 

举例如下：

//嵌套
ul{
    li{
        a
	}
}
//相当于
ul li a{
	
}

//变量
$toolbar-size: 52px;

 

//@mixin 函数名(参数)
@mixin opacity($opacity){
    opacity: $opacity;
    filter: alpha(opacity=$opacity * 100);
}

//调用时使用 @include
@include opacity(1);

//外部文件引入（引入时无需加文件名后缀，系统会自动补全，且只能引入.scss结尾的文件）
@import "toolbar";

//extend继承
.box{
    ...
    ...
    ...
}

.box2{
 @extend .box
}