scss 是 sass 的升级版
是一个成熟，稳定，强大的 css 预处理器，scss 是 sass3版 引入的新语法特性；
scss文件，不怎么支持中文，所以：我们要在开头 写上 @charset "utf-8";
$变量名 声明变量的方式；
引入 scss 文件 通过 @import "scss文件";
函数：算法（使用场景：我们可以在 scss 文件，进行 加 减 乘 除）
案例：
@function p2r($width){
@return ($width/32)*1rem;
}
div{
width:p2r(100);
}
注意：涉及到 sass 语法 或者 javascript 语法；要用@；
混入样式：（使用场景：有很多相同的样式的时候使用，我们也里面使用 函数算法 ）；
关键字 @mixin（定义） @include（引入）
案例：
@mixin bg($width,$height,$url){
width:p2r($width);
height:p2r($height);
background:url($url) no-repeat;
}
div{
@include bg(100,100,"01.png");
}
嵌套：一种颠覆 css 写法的
div{
//这里写div 的样式
p{
//这里写 p 的样式
& 关键字：代表 p
}
& 关键字 ：代表div
}
<div>
<p></p>
</div>
scss 的编辑 css 后的结果：
div p{
}
es6 的介绍：
let 和 const 关键字
用法：避免污染全局变量；
所以：在 { } 里面 变量才有效；
声明变量和常量的关键字：
变量：let
常量：const
主要是 =>
function
案例：
// a b 形参：代表形参 => { } 代表语句执行；
var f=(a,b) => {
console.log(a+b);
}
f(1,2)
class
案例：
class a{
a="hello"; //属性的定义
fn(a,b){ //方法的定义
setTimeout(()=>{
console.log(this);
},1000)
}
}
var b=new a() // b 代表实例对象，一定要用 new 他的构造器；
b.fn(1,2) 方法的调用