Sass学习笔记。

Sass:

  定义：css预处理器定义了一种新的语言，其基本思想是，用一种专门的编程语言，为css增加了一些编程的特性，将css作为目标生成文件，然后开发者就只要使用这种语言进行编码工作。（采用RuBy语言编写的一款css预处理语言）  扩展名：.sass(严格的缩进式语法)     .scss（与平时css语法书写类似） scss和css写法无差别，这也是Sass后来越来越受大众喜欢原因之一。

Sass编译

方法：

1. 命令编译（我喜欢）
2. GUI工具编译
3. 自动化编译（Grunt和Gulp）

命令编译：

  单文件编译        sass（要编译的Sass文件路径）/style.scss:（要输出css文件路径）/style.css  多文件编译        sass sass/:css/        上面的命令表示将项目中的"sass"文件夹中所有".scss"(".sass")文件编译成".css"文件，并且将这些css文件都放在项目"css"文件夹中。

开启”watch”功能，这样只要你的代码进行任何修改，都能自动监测到代码的变化，并且给你直接编译出来：

sass  --watch  （要编译的Sass文件路径）/style.scss:（要输出css文件路径）/style.css

Sass常见的编译错误

1. 字符编码引起的（不支持”GBK”编码，设置为”UTF-8”）
2. 路径中的中文字符（不要使用中文字符命名文件目录名）

不同样式风格的输出方法：

 1.嵌套输出方式 nested 2.展开输出方式 expanded     命令行最后加 -- style expanded 3.紧凑输出方式 compact 4.压缩输出方式 compressed

Sass普通变量与默认变量

普通变量：定义之后可以在全局范围内使用。默认变量：sass的默认变量仅需要在值后面加上！default即可。（Sass的默认变量一般是用来设置默认值，然后根据需求来覆盖的，只需要在默认变量之前重新声明下变量即可。）默认变量的价值在进行组件化开发的时候会非常有用。