发表于： 2017-03-24 22:32:14
1 651
- 文件扩展名不同，Sass 是以“.sass”后缀为扩展名，而 SCSS 是以“.scss”后缀为扩展名
- 语法书写方式不同，Sass 是以严格的缩进式语法规则来书写，不带大括号({})和分号(;)，而 SCSS 的语法书写和我们的 CSS 语法书写方式非常类似。
- 数值（可包括单位）
- 颜色
今天完成的事情：（一定要写非常细致的内容，比如说学会了盒子模型，了解了Margin）
了解什么是CSS 预处理器
了解了Sass
了解了Less
明天计划的事情：（一定要写非常细致的内容）
任务11:基于css的更高级语言——使用less/sass重写任务4（登录页），并编译
遇到的问题：（遇到什么困难，怎么解决的）
收获：（通过今天的学习，学到了什么知识）
什么是 CSS 预处理器？
CSS 预处理器定义了一种新的语言，其基本思想是用一种专门的编程语言，为 CSS 增加了一些编程的特性，将 CSS 作为目标生成文件，然后开发者就只要使用这种语言进行编码工作。
通俗的说，“CSS 预处理器用一种专门的编程语言，进行 Web 页面样式设计，然后再编译成正常的 CSS 文件，以供项目使用。CSS 预处理器为 CSS 增加一些编程的特性，无需考虑浏览器的兼容性问题”，例如你可以在 CSS 中使用变量、简单的逻辑程序、函数等等在编程语言中的一些基本特性，可以让你的 CSS 更加简洁、适应性更强、可读性更佳，更易于代码的维护等诸多好处。
From <http://www.imooc.com/code/5993>
什么是 Sass？
Sass 官网上是这样描述 Sass 的：
Sass 是一门高于 CSS 的元语言，它能用来清晰地、结构化地描述文件样式，有着比普通 CSS 更加强大的功能。
Sass 能够提供更简洁、更优雅的语法，同时提供多种功能来创建可维护和管理的样式表。
From <http://www.imooc.com/code/6371>
Sass 和 SCSS 有什么区别？
Sass 和 SCSS 其实是同一种东西，我们平时都称之为 Sass，两者之间不同之处有以下两点：
先来看一个示例：
Sass 语法
$font-stack: Helvetica, sans-serif //定义变量
$primary-color: #333 //定义变量
body
font: 100% $font-stack
color: $primary-color
SCSS 语法
$font-stack: Helvetica, sans-serif;
$primary-color: #333;
body {
font: 100% $font-stack;
color: $primary-color;
}
编译出来的 CSS
body {
font: 100% Helvetica, sans-serif;
color: #333;
}
From <http://www.imooc.com/code/6373>
Sass支持定义变量。变量以美元符号（$）作为开头。变量用冒号（:）赋值。
SassScript支持四种数据类型：
变量可以用作函数的参数或返回值。在解释过程中，解释器会把变量的值写入最终的CSS文件中。
From <https://zh.wikipedia.org/wiki/Sass#.E5.8F.98.E9.87.8F>
返回列表
评论