关于css:什么是Sass

12次阅读

共计 1307 个字符，预计需要花费 4 分钟才能阅读完成。

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

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

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

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

正文完