Sass
- SASS官网
- 世界上最成熟、最稳定、最强大的专业级CSS扩展语言!
-
sass 是一个 css 的预编译工具 - 也就是能够 更优雅 的书写
css -
sass 写出来的东西 浏览器不认识 - 依旧是要转换成
css 在浏览器中运行
变量
- 定义一个变量,在后面的代码中使用
- 使用
$ 来定义变量
1
// 定义一个 $c 作为变量,值是 红色
2
$c: red;
3
4
h1 {
5
// 在使用 $c 这个变量
6
color: $c;
7
}
- 上面定义的变量全局都可以使用
- 我们也可以在规则块内定义私有变量
嵌套
-
sass 里面我们最长用到的就是嵌套了 - 而且相当的好用
- 这个就是嵌套,理论上可以无限嵌套下去
嵌套中的 &
- 在嵌套中还有一个标识符是
& 我们可以使用 - 先来看一个例子
- 和预想的结果不一样了
- 这个时候就要用到
& 来连接了
- 这个时候就和我需要的一样了
群组嵌套
- 群组嵌套就是多个标签同时嵌套
- 还有一种就是多个标签同时嵌套一个标签