添加没有全局的 css 变量 - CSS

当你使用CSS编写样式时，全局CSS变量可以让你更方便地控制样式的变化。但是有些时候，你可能需要在没有全局CSS变量的情况下添加自定义变量。

下面介绍两种方法来实现。

使用 :root 选择器

使用:root选择器来添加自定义变量。

:root {
  --my-variable: red;
}

然后你就可以在其他地方使用这个变量。

.my-element {
  color: var(--my-variable);
}

在你的选择器中添加变量

将变量直接添加到你的选择器中。

.my-element {
  --my-variable: red;
  color: var(--my-variable);
}

这种方法更适用于需要在一组样式中使用变量的情况。

以上是两种添加没有全局CSS变量的方法，你可以根据你的需要选择其中一种。