css - LESS CSS 中的转义字符会插入不需要的空格

Question

我正在尝试编写对应于以下 CSS 代码的 LESS 代码，用于在 IE 中生成渐变。

filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff9600',endColorstr='#ff6900');

下面是LESS代码:

.gradient(@start_color, @end_color)
{
    filter:~"progid:DXImageTransform.Microsoft.gradient(startColorstr='"@start_color~"',endColorstr='"@end_color~"')";
}
.gradient(#ff9600,#ff6900)

在编译时它给出以下 CSS 代码:

filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=' #ff9600 ', endColorstr=' #ff6900 ');

如您所见，颜色值的两边插入了空格，因此 IE 无法正确读取颜色。

我已经使用 http://crunchapp.net/ 编译了 LESS 代码以及http://winless.org/两者都提供相同的结果。是否有避免这些空间的技巧。谢谢。

Answer 1

使用变量插值而不是结束字符串并重新启动它。

例如

~"bar@{name}foo"

并且不会插入空格。