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)　　　　　 方法的调用