sass

@mixin @include 混合器

　　　　@mixin col($num){　　　　　　　　　　//编写mixin方法
　　　　　　$num;
　　　　　　height:$num;
　　　　}
　　　　.div{

　　　　　　@include col(100px);　　　　　　//使用@include调用方法
　　　　　　background-color: #f5f5f5;　　　
　　　　}

　　　　@mixin col($num:100px){　　　　　　　　　　//默认参数
　　　　　　$num;
　　　　　　height:$num;
　　　　}
　　　　.div{

　　　　　　@include col();　　　　　　　　　//调用时不用传参　　如果不带参数，（）可以省略
　　　　　　background-color: #f5f5f5;　　　
　　　　}

@extend 继承

　　　　 .b{

　　　　　　 @extend .a;　　　　　　//首先要有.a这个类的样式　　　　

　　　　 }

　　　　@extend .p,.cols;　　　　可以连写　　@import也可以连写

　　　　假设 .a{color:#fff} .b{@extend .a} .a.b{color:#000} .b会继承.a 即 .a,.b{color:#fff} 再继承.a.b 即 .a.b,.b{color:#000} .a.b在后所以#000颜色会覆盖#fff

% 占位符　　

　　　　构建仅用来继承的选择器，不会输出到css中

　　　　%a{ ... } 　　.b { @extend %a }

@at-root 转为CSS时不包含嵌套

　　　　.a{ .b{ } } 转为css时，.b是转为.a下的.b （.a .b ）

　　　　.a{ @at-root{ .b{ } } }　　　　加上@root .b在转化的时候直接是转为.b

参数校验

　　　　@mixin col-sm($50%) {
　　　　　　@if type-of($width) !=number {　　　　//判断类型
　　　　　　　　@error "$width必须是一个数值类型，你输入的是#{$width}"
　　　　　　}
　　　　@if not unitless($width) {　　　　　　//判断数值是否无单位，有单位的话返回false
　　　　　　@if unit($width)!="%" {　　　　　　//判断单位是否是百分号
　　　　　　　　@error "$width应该是一个百分值，你输入的是#{$width}"　　　　#{} 字符串中填写变量
　　　　　　}
　　　　} @else {
　　　　　　@warn "$width应该是一个百分值，你输入的是#{$width}" ;
　　　　　　$percentage($width);　　　　 //将数值转换为百分比
　　　　　　}
　　　　$width;
　　　　}

config配置文件

　　　　config里的output_style

　　　　取值为 :expanded 默认输出格式

　　　　取值为 :nested时　　包含结构嵌套

　　　　取值为 :compact时　　选择器汇总在一行

　　　　取值为 :compressed时　　压缩格式　　上线前使用

　　　　config中的line_comments

　　　　修改为 line_comments = false 去除转换后的css中的注释

unquote($string)：删除字符串中的引号；

quote($string)：给字符串添加引号

To-lower-case() 函数与 To-upper-case() 刚好相反，将字符串转换成小写字母：

percentage($value)：将一个不带单位的数转换成百分比值；
round($value)：将数值四舍五入，转换成一个最接近的整数；
ceil($value)：上取整；
floor($value)：下取整；
abs($value)：返回一个数的绝对值；
min($numbers…)：找出几个数值之间的最小值；
max($numbers…)：找出几个数值之间的最大值；
random(): 获取随机数

length($list)：返回一个列表的长度值；
nth($list, $n)：返回一个列表中指定的某个标签值
```
>> nth(10px 20px 30px,1)
10px
```
join($list1, $list2, [$separator])：将两个列给连接在一起，变成一个列表；
append($list1, $val, [$separator])：将某个值放在列表的最后；
zip($lists…)：将几个列表结合成一个多维的列表；
index($list, $value)：返回一个值在列表中的位置值。

type-of($value)：返回一个值的类型
unit($number)：返回一个值的单位
unitless($number)：判断一个值是否带有单位不带单位返回的值为 true
comparable($number-1, $number-2)：判断两个值是否可以做加、减和合并

if($condition,$if-true,$if-false)

>> if(true,1px,2px)
1px
>> if(false,1px,2px)
2px

map-get($map,$key)：根据给定的 key 值，返回 map 中相关的值。
map-merge($map1,$map2)：将两个 map 合并成一个新的 map。
map-remove($map,$key)：从 map 中删除一个 key，返回一个新 map。
map-keys($map)：返回 map 中所有的 key。
map-values($map)：返回 map 中所有的 value。
map-has-key($map,$key)：根据给定的 key 值判断 map 是否有对应的 value 值，如果有返回 true，否则返回 false。
keywords($args)：返回一个函数的参数，这个参数可以动态的设置 key 和 value。

mix($color-1,$color-2,$weight);

mix(#f00, #00f) => #7f007f
mix(#f00, #00f, 25%) => #3f00bf

rgba($red,$green,$blue,$alpha)  //将一个rgba颜色转译出来，和未转译的值一样
rgba($color,$alpha)  //将一个Hex颜色转换成rgba颜色

 border-color: rgba(green,.5);

 border-color: rgba(0, 128, 0, 0.5);