【css预处理器】css预处理器及sass基本介绍

001、什么是css预处理器？

css预处理器定义了一种新的语言。用一种专门的编程语言，为css增加了一些编程的特性，将css作为目标生成文件，然后开发者就只要使用这种语言进行编码工作。（通俗点说“”css预处理器用一种专门的编程语言，进行web页面样式设计，然后在编译成正常的css文件，以供项目使用“”）

 

---

 

002、css预处理器的优点

css预处理器为css增加一些编程的特性，无需考虑浏览器的兼容性问题。如在css中使用 变量、简单的逻辑程序、函数。可以让你的css更加简洁、适应性更强、可读性更佳、更易于代码的维护

---

 

003、什么是sass?

sass是一门高于css的元语言。它能清晰的、结构化的描述文件样式，有着比普通css更加强大的功能。sass能够提供更简洁、更优雅的语法，同时提供多种功能来创建可维护和管理的样式表。

 

sass是采用Ruby语言编写的一款css预处理语言

 

---

004、sass和scss有什么区别？

 

sass和scss其实是同一种东西，我们平时都称之为sass，两者之间不同之处有以下2点。

1、文件扩展名不同，sass是以sass为后缀为扩展名，而scss是以.scss后缀为扩展名。

2、语法书写方式不同，sass是以严格的缩进语法规则来书写，不带大括号（{}）和分号（；），而scss的语法书写我们的css语法书写方式非常类似

 

//scss写法
$width:300px;
$height:400px;

body{
     width:$width;
     height:$height;
}


//sass写法
$with:100px;
$height:100px;

body
     width:$width