在较少的时间内使用CSS变量

这看起来很基本，但我不知道如何在更少的时间内使用CSS变量

variables.css：

.root {
    --header-color: white;
    --content-color: yellow;
}

无样式：

@import "../variables.css";
.header {
   color: @header-color;
}

---

我得到错误“@标题颜色未定义”。

LESS允许您使用普通CSS代码，因此使用一个选项可以是将变量用作CSS：

@import "../variables.css";
.header {
   color: var(--header-color);
}

显然，您可以将css变量保存为较小的变量：

@import "../variables.css";
@header-color: var(--header-color);

.header {
   color: @header-color;
}