css - 添加了 Sass、IE 过滤器和额外的空格

Question

我为我的 Visual Studio(网络工作台)添加了 Sass 插件。这很好，因为一旦我保存了 .scss 文件，就会立即生成 css 文件。无论如何，我有一个 IE“过滤器:”设置，Sass 编译器正在添加额外的空间。

我的变量:

$blueColor: 5993D3; 
$lightColor: FFFFFF;

我的混入: (浅色为白色，在所有调用中都相同，这就是为什么它不作为变量传递的原因)

@mixin filterIE($startColor) {
    filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=1,StartColorStr='#FF#{$startColor}', EndColorStr='#00#{$lightColor}');
}

我的包括:

@include filterIE($blueColor);

问题是输出。它在其中放置了一个额外的空间(注意 StartColorStr 中的 3。无论我尝试什么，它都会添加一个空间。我在页面上还有其他一些空间，它们工作正常。

filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=1, StartColorStr='#FF5993D 3', EndColorStr='#00FFFFFF');

您可以看到 lightColor 工作正常。没有空间。有什么想法吗？

Answer 1

我认为问题在于 SASS 没有正确理解 $blueColor 变量的数据类型(它不是十六进制颜色，因为它不以 # 开头，如果您更改带有字母的第一个字符，空格不会出现)。

通过在变量中添加引号来修复它

$blueColor: "5993D3";

它不会出现在输出中，因为您已经在混合中使用插值#{}。