sass和canvas

介绍

css编写时权重难以控制，嵌套层级多导致代码编写不方便。sass的出现就是为了解决css的缺点。

sass不能直接被浏览器识别，所以需要进行编译成正常的css文件才能被浏览器使用。

sass文件的后缀有两种：

1.   .sass   -  嵌套关系不用{}，用缩进来表示的

2.   .scss - 跟css的写法是一样的

sass不能直接被html引入使用，浏览器不能识别这种类型的文件和这种语法

    sass文件需要编译成css文件才能用

    npm中有一个工具，专门用来编译sass文件 - sass

    1.下载sass工具 - npm下载安装

        npm i sass -g

    2.测试是否能用

        sass --version

    3.编译

        sass 被编译的文件 编译以后的文件

    4.监视文件变化自动编译

        sass --watch 被编译的文件:编译后的文件

    5.监视文件夹变化自动编译

        sass --watch 被编译的文件所在的文件夹:编译以后的文件所在的文件夹

    map文件：如果有错误，map文件能指引浏览器将错误指到源文件  - sass，如果没有map文件，浏览器错误提示在css中

注释

// 单行注释，但是在编译的时候不保留
/*
多行注释
编译的时候可以保留
压缩的时候不保留
*/
/*!
多行注释
编译和压缩的时候都会保留
*/

变量

定义语法：

$变量名:值;

值里面是字符串的，也不需要加引号