gpt4 book ai didi

css - 打印样式表中的 Sass 变量覆盖 "all"样式表中的变量

转载 作者:技术小花猫 更新时间:2023-10-29 11:40:44 26 4
gpt4 key购买 nike

我使用最新的 SASS/Compass 版本来开发 CSS。我在“media=all”样式表的开头声明了一些 SASS 变量,如下所示:

$var1: red;
$var2: blue;
$var3: black;
$var4: green;

稍后在此 SCSS 文件中,我导入打印样式表 (@import 'print.scss';),如下所示:

@media print {
$var1: black;
$var2: black;
$var4:black;
}

我认为,如果浏览器处于“打印模式”,则打印样式表中的变量会覆盖“正常”变量。但是这些变量确实会覆盖总是之前声明的“正常”变量。

我有点困惑,感谢任何帮助。

谢谢!

最佳答案

根据 this问题,以你目前的形式基本上是不可能的。如果你想实现这一点,你必须导入使用你的 $varX 的每个样式,例如:

$blue: blue;

.test{
color: $blue;
}

@media print {
$blue: pink;
.test{
color: $blue;
}
}

输出:

.test{color:blue}@media print{.test{color:pink}}

这不是理想的解决方案(您会得到很多重复的代码),但不幸的是,由于 CSS 的工作方式,您只能这样做。

这可能是一个稍微好一点的解决方案:

$blue: blue;
$print_blue: pink;

.test{
color: $blue;
text-align: right;
@media print {
color: $print_blue;
}
}

输出:

.test{color:blue;text-align:right}@media print{.test{color:pink}}

关于css - 打印样式表中的 Sass 变量覆盖 "all"样式表中的变量,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15632272/

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