编译为CSS

Question

少即是增加对URL不必要的代码，所以我有这样的事情：

此

@color1: rgba(0, 0, 0, 0); 
@color2: rgba(0, 0, 0, 0.7); 
#start-view .start1 { 
    .imageGradientOverlay(@color1, @color2, "../images/start/start1.jpg"); 
} 

变量是：

.imageGradientOverlay(@color1, @color2, @url-image) { 
    background-image: 
     linear-gradient(@color1, @color2), 
     url(@url-image); 

    background-image: 
     -webkit-linear-gradient(@color1, @color2), 
     url(@url-image); 
} 

和编译后的代码如下所示：

#start-view .start1 { 
    background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.7)), url("../../../images/start/start1.jpg"); 
    background-image: -webkit-linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.7)), url("../../../images/start/start1.jpg"); 
} 

问题是 - 为什么编译时少加两个../../？

如果我尝试添加这个/images/start/start1.jpg代码编译得很好，但这不是我所需要的。

Answer 1

看看LESS options，我相信你有rootpath设置为添加该前缀。所以重置rootpath，它应该没问题。

您可以在这里测试 - LESS2CSS，只需添加该选项即可。