CSS 中的“$”是什么意思？

我看到一个动画项目，里面有一堆“$”。我不知道美元符号在 CSS 中的用途。我猜这是为了动画。这是我正在查看的一些代码的示例：

$emoji-base-color: #FFDA6A;
$emoji-like-color: #548DFF;

.emoji--like {
background: $emoji-like-color;
 &:after {
            content: 'Like';
         }

这是整个项目的链接：https://codepen.io/AshBardhan/pen/dNKwXz https://codepen.io/AshBardhan/pen/dNKwXz

这些是 SASS (SCSS) 变量，用于存储颜色属性，以便稍后使用。另外，为了给您一个基本概念，SASS 是一个 CSS 预处理器，它允许您嵌套选择器、使用 mixin、在变量上存储值等。

You can see it (scss) referenced in the codepen CSS section:

取自SASS 文档 http://sass-lang.com/guide（参考变量）：

将变量视为存储您想要的信息的一种方式 在整个样式表中重复使用。你可以存储颜色之类的东西， 字体堆栈，或您认为想要重用的任何 CSS 值。萨斯 使用 $ 符号使某些内容成为变量。这是一个例子：

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

body {
  font: 100% $font-stack;
  color: $primary-color;
}

如果您想知道 SASS 和 SCSS 之间的区别，其基本语法如下来自文档 http://sass-lang.com/documentation/file.SASS_REFERENCE.html#syntax:

Sass 有两种可用的语法。第一个被称为SCSS（Sassy CSS）并在整个参考中使用，是 CSS 的语法。这意味着每个有效的 CSS 样式表都是有效的 SCSS文件具有相同的含义。此语法通过 Sass 得到增强 特点如下所述。使用此语法的文件具有 .scss 扩大。

第二种或更旧的语法，称为缩进语法（或 有时只是“Sass”），提供了一种更简洁的 CSS 编写方式。它 使用缩进而不是括号来指示嵌套 选择器和换行符而不是分号来分隔属性。 使用此语法的文件具有 .sass 扩展名。