首先需要安装sass loder，一共两个软件安装到vue中，然后在main.js中引用这个sass软件，可以自己写，然后会自动生产一个文件，自己可以自动去翻译的如图引用方法的话
下载完然后可以引用，自己通过class里面添加自己方便的css的样式，然后自己去编译就可以了，自己分开两个文件，一个是原来的死的样式，一个是可以变化的相乘的css的padding等等的小边框一些其他的东西，然后就是flex的使用就是如果需要左右分开的话文字和图片一起都是算一个盒子的话，那么需要在这个两个div或者img里面套一个父亲的盒子，然后父亲的盒子和另外div再用flex：space-between的样式进行左右分开效果如图片。
以及雪碧图可以进行定位等等的很多使用，就不需要下载ps，fireworks这些软件进行定位，以及可以第一时间查看图片的大小高度或者宽度等等，
sass使用的是$这个代表的是变量是用于下载版本的，不会有冲突的，视频建议的sass变量是使用这个下划线_这个符号，但是写vue的时候记得带上变量符号，一定会辨别的，不然会报错的，然后就是嵌套的css，记得一个很重要的就是vue的页面style这个记得写
lang="scss"，以及需要@import '../variables.scss';引用这个sass的样式，.
父选择器的标识符&
一般情况下，sass在解开一个嵌套规则时就会把父选择器（#content）通过一个空格连接到子选择器的前边（article和aside）形成（#content article和#content aside）。这种在CSS里边被称为后代选择器，因为它选择ID为content的元素内所有命中选择器article和aside的元素。但在有些情况下你却不会希望sass使用这种后代选择器的方式生成这种连接。
最常见的一种情况是当你为链接之类的元素写：hover这种伪类时，你并不希望以后代选择器的方式连接。比如说，下面这种情况sass就无法正常工作： // 这种注释内容不会出现在生成的css文件中
！这个可以优先显示权重的哦
这个alt+z可以显示rem的，需要vscode安装一个转换器，each命令，作用与for类似：
map-get(
key) 函数的作用是根据 
key 在 
key 不存在 $map中，将返回 null 值。此函数包括两个参数：
key：需要遍历的 key。
