gpt4 book ai didi

html - 选择器中变量的 Scss 设置值会导致它更改,即使没有具有给定选择器的元素可用

转载 作者:太空宇宙 更新时间:2023-11-04 05:44:30 24 4
gpt4 key购买 nike

SCSS 文件

$dark-theme: false!default;
$primary-dark: blue;

[dark-mode='dark'] {
background:gray!important;
$dark-theme: true!global;
}

[dark-mode='light'] {
background:yellow!important;
$dark-theme: false!global;
}

@if $dark-theme==true{
$primary-dark: black!global;
} @else{
$primary-dark: blue!global;
}

HTML

<html>
<body dark-mode="dark">
</body>
</html>

上面的代码总是在正确设置背景的情况下设置 [dark-mode='light'] 中给定的 $dark-theme 值

最佳答案

看来您误解了 SASS 的工作原理。 SASS 变量仅在编译期间使用,因此一旦代码被编译,它们就不再存在。

无论是否有元素带有DOM 中的值 darklight。由于 light 属性是代码中的最后一组,因此 $dark-theme 在到达您的 @ 时将始终为 false if 所以 $primary-dark 将始终具有值 blue

如果你想保留这个方法,你可以看看CSS variables反而。 Here is a nice article about this .

关于html - 选择器中变量的 Scss 设置值会导致它更改,即使没有具有给定选择器的元素可用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58845281/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com