SASS (gulp-sass) 语法问题 - 带有变量的 @media 没有输出

Question

我使用gulp-sass 版本3.0.0 和Gulp 版本3.9.1

我暂时无法更新 Gulp。

当我将变量与@media 一起使用时，我没有输出：

$screen-lg: 1200px;

$under-lg: "screen and (max-width: ($screen-lg - 1px))"; 

@media #{$under-lg} {
   width: 100%;
}

你知道为什么吗？谢谢。

Answer 1

由于变量在字符串中，您必须使用interpolation 来获得$screen-lg - 1px 的结果：

$screen-lg: 1200px;

$under-lg: "screen and (max-width: (#{$screen-lg - 1px}))"; 

@media #{$under-lg} {
   width: 100%;
}