css - 不能覆盖 CSS :root 变量 | --原色：橙色；不回应

Question

这是我的“根”：

:root {

--primary-color: #B92430;
}

但我不能在后续课程中覆盖它：

h1 {

--primary-color: orange;
font-family: 'New Tegomin', sans-serif;

}

h1 类不响应变量。

标签： cssvariablesoverriding

Answer 1

尽管您已经定义（并重新定义）变量是什么，但您还没有说明它应该应用于什么属性。在这里，我假设您的意思是color.

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

h1.change {
  --primary-color: red;
  color: var(--primary-color);
}

<h1 class="change">Lorem, ipsum.</h1>