我可以使用 类 来更改 css 变量吗？

Question

我可以使用 类 更改 SCSS 文件中的 CSS 变量吗？ 它有效，但我想知道这样做是否正确：

.header {
  --transform: translate(-50%, 0);
  transform: var(--transform);
  &--hide {
     --transform: translate(-50%, -84px);
  }
  &--show {
     --transform: translate(-50%, 0);
  }
}

// instead of this:

.header {
  transform: translate(-50%, 0);
  &--hide {
     transform: translate(-50%, -84px);
  }
  &--show {
     transform: translate(-50%, 0);
  }
}

Answer 1

是的，您在 class 中重写了 css 变量，如下所示：

:root {
  --test: red;
}    
.header {    
  --test: green;
  color: var(--test);       
}

<div class="header">abc</div>

注意::但我现在无法想象一个用例！？