掌握sass这些技能，帮助提升开发效率

先放一张logo镇楼，emmm...

CSS预处理技术，及种类介绍

什么是css预处理技术
- CSS 预处理器定义了一种新的语言，其基本思想是，用一种专门的编程语言，为 CSS 增加了一些编程的特性，将 CSS 作为目标生成文件，然后开发者就只要使用这种语言进行编码工作。
- 通俗的说，“CSS 预处理器用一种专门的编程语言，进行 Web 页面样式设计，然后再编译成正常的 CSS 文件，以供项目使用。CSS 预处理器为 CSS 增加一些编程的特性，无需考虑浏览器的兼容性问题”，例如你可以在 CSS 中使用变量、简单的逻辑程序、函数（如变量$main-color）等等在编程语言中的一些基本特性，可以让你的 CSS 更加简洁、适应性更强、可读性更佳，更易于代码的维护等诸多好处。
css预处理技术的种类
- Sass（SCSS）
- LESS
- Stylus
- Turbine
- Swithch CSS
- CSS Cacheer
- DT CSS

如此之多的 CSS 预处理器，那么“我应该选择哪种 CSS 预处理器？”也相应成了最近网上的一大热门话题，各大技术论坛也是争论不休，如掘金(哈哈，偷偷舔一波)

到目前为止，在众多优秀的 CSS 预处理器语言中就属 Sass、LESS 和 Stylus 最优秀，讨论的也多，今天小编将介绍 CSS 预处理器中的 Sass。相信各位攻城狮会稀饭的

废话不说，直接上代码

局部变量的含义类似于javascript中的局部变量(啥是局部变量，额.....)

使用&可以增加选择器权重

属性嵌套是把属性拆分成对象。对象内成key，value

使用%声明占位符，@extend 来应用占位符

占位符的功能非常强大，如果只声明了占位符，没有引用，编辑完成时，则不会生成代码

说完占位符之后，赶紧拿小本本把拓展与继承也记下来

可以看出占位符和继承中都运用了@extend

区别是占位符不会生成有效代码，而继承一个父类时，父类是有效的代码

混入指令有很多叫法，如混合指令，宏指令。小编就按照Vue的叫法，叫它混入了

混入指令可以设置参数来灵活的运用

如果你有时候不想传参数，那就在声明时设置个默认参数

控制指令是一种高级功能，日常编写过程中并不常用到，主要与混合指令 (mixin) 配合使用

Sass 扩展了 CSS 的 @import 规则，让它能够引入 SCSS 和 Sass 文件。所有引入的 SCSS 和 Sass 文件都会被合并并输出一个单一的 CSS 文件。另外，被导入的文件中所定义的变量或 mixins 都可以在主文件中使用。
@import 根据文件名引入。默认情况下，它会寻找 Sass 文件并直接引入，但是，在少数几种情况下，它会被编译成 CSS 的 @import规则
- 文件的扩展名是 .css。
- 文件名以 http:// 开头。
- 文件名是 url()。
- @import 包含了任何媒体查询（media queries）。
如果上述情况都没有出现，并且扩展名是 .scss 或 .sass，该名称的 Sass 或 SCSS 文件就会被引入。如果没有扩展名， Sass 将试着找出具有 .scss 或 .sass 扩展名的同名文件并将其引入。