// 以下是一段Sass代码示例
$primary-color: #007bff; // 定义变量
$font-size-large: 2rem;
h1 {
font-size: $font-size-large;
color: $primary-color;
}
p {
font-size: 1rem;
color: $primary-color;
margin-bottom: 1rem;
&.large { // 嵌套选择器
font-size: $font-size-large;
}
}Sass主要有以下几个特点：
- 变量：可以定义变量来存储颜色、字体大小等常用的属性值，方便统一管理和修改。
- 嵌套：可以嵌套选择器来使代码更加清晰简洁。
- 运算：可以对属性值进行加、减、乘、除等运算。
- 函数：内置了许多函数，用于处理颜色、字体等相关计算。
- 继承和占位符：可以通过继承和占位符来减少代码的重复。
Sass的语法类似于Ruby，需要通过编译器将Sass代码编译成纯CSS代码才能在浏览器中使用，常见的编译器包括Sass、Compass、Less等。