css - Visual Studio Code 无法识别 CSS 文件中的变量

Question

我正在使用 Visual Studio Code，并且我在 CSS 文件中的变量存在问题，当我输入美元符号时，css 文件报告错误并且浏览器不会看到文件中的更改。

标签： cssvariablesvisual-studio-code

Answer 1

这就是定义 CSS 变量的方式。您正在查看的变量在 SCSS 中使用。要使用 SCSS，您需要类似node-sass

:root {
  --primary-color: red;
}

div {
  background: var(--primary-color);
  width: 200px;
  height: 200px;
}

body {
  color: var(--primary-color);
}

<div></div>

<p>
  Lorem ipsum
</p>

要让 VSCode 了解 SCSS，请确保文件按原样 ( .scss) 存储。如果这仍然不起作用，请将语言模式设置为 SCSS。语言模式可以在右下角找到。