如何从另一个css文件导入css根常量

Question

我有两个CSS文件constant.css和main.css

在我的Constants.css文件中 root: { --primaryColor: red; }

在我的main.css文件中 .example { background-color: var(primaryColor); }

预期的行为是红色作为背景色。示例类，但它不起作用。

我尝试@include 'constants.css'过@include url('constants.css')，但没有帮助。

所以我的问题是如何包含另一个 css 文件中的根常量？

Answer 1

在你的constants.css中定义你的css变量

:root {
  --green: #119955;
}

@import './constants.css;然后在 main.css 文件中使用它来导入它。并使用你的变量

@import './constants.css';

body {
  background-color: var(--green);
}