关于css:什么是Sass

什么是 Sass

Sass 是 Syntactically Awesome Stylesheets 的简写，是一个最后由 Hampton Catlin 设计并由 Natalie Weizenbaum 开发的层叠样式表语言。

Sass 是一个将脚本解析成 CSS 的脚本语言（SassScript），也是一款 CSS 预处理器，它缩小了 CSS 的反复，也因而节俭了工夫。Sass 是最早的 CSS 预处理语言，有比 Less 更弱小的性能。Sass 扩大了 CSS3，减少了规定、变量、混入选择器、继承等个性。

什么是 CSS 预处理器

咱们晓得了 Sass 是 CSS 的预处理器，那么什么是预处理器呢？CSS 预处理器定义了一种新的语言，其根本思维是，用一种专门的编程语言，为 CSS 减少了一些编程的个性，将 CSS 作为指标生成文件，而后开发者就只有应用这种语言进行编码工作。也就是说，CSS 预处理器用一种专门的编程语言，进行 Web 页面款式设计，而后再编译成失常的 CSS 文件，以供我的项目应用。CSS 预处理器为 CSS 减少一些编程的个性，无需思考浏览器的兼容性问题。

Sass 的特色性能

• Sass 齐全兼容所有版本的 CSS。
• Sass 领有比其余任何 CSS 扩大语言更多的性能和个性，例如减少了变量、嵌套、混合等性能。
• 通过函数进行色彩值与属性值的运算。
• 提供了控制指令（control directives）。
• 自定义输入格局。

语法格局

Sass 语言有两种语法格局：

• 最开始的语法叫做缩进语法（Indented Sass），通常简称为 Sass，是一种简化格局。它应用缩进来代替花括号 {}，示意属性属于某个选择器。用换行代替分号分隔属性。
• 另一种语法是 SCSS（Sassy CSS），这种格局仅在 CSS3 语法的根底上进行拓展，所有 CSS3 语法在 SCSS 中都是通用的，同时退出 Sass 的特色性能。

这两种语法格局，任何一种格局都能够间接通过 @import 导入到另一种格局中应用，或者通过 sass-convert 命令行工具转换成另一种格局：

// Sass 转为 SCSS
$ sass-convert style.sass style.scss

// SCSS 转为 Sass
$ sass-convert style.scss style.sass

Sass 个性

• 变量：Sass 中反对定义变量，变量以美元符号 $ 作为结尾，而后通过冒号 : 赋值。变量反对四种数据类型，别离为字符串、数值、布尔类型、色彩值。
• 嵌套（Nesting）：SCSS 反对嵌套并且反对代码块的嵌套，它能够清晰的示意元素之间的关系。
• 导入（@import）：Sass 反对 @import 指令，该指令容许咱们将一个文件的内容导入到另一个文件中。该指令蕴含 CSS 文件，因而不须要额定的调用 HTTP，而因为性能问题，CSS 指令每次调用都会创立一个额定的 HTTP，在这里 Sass 就没有这样的问题。
• 混入（mixin）：Sass 中能够应用 @mixin 来申明混合，混合中蕴含一段非法 Sass 代码，相似于 C 语言的宏定义，解释器在调用混合时会将它扩大成它所蕴含的残缺 Sass 代码，能够无效的缩小代码反复，从而写出的代码更加洁净简洁。
• 继承（@extend）：该指令容许咱们将一组 CSS 属性从一个选择器共享到另一个选择器。