SCSS

与 Sass 一样,SCSS 变量用于存储将在整个 SCSS 文档中多次使用的值。

变量主要用于存储常用属性值(如字体和颜色),但可用于任何属性的任何值。

SCSS 使用 $ 符号声明变量。

$font-stack: Helvetica, sans-serif;
$primary-color: #000000;

body {
  font-family: $font-stack;
  color: $primary-color;
}

如果要为此变量分配新值,仅在尚未分配变量时,可以在声明变量时使用 !default

$primary-color: blue;
$primary-color: red !default; // $primary-color is still "blue"
$primary-color: green;        // And now it's green.