線性漸變過濾器

Question

我在mixin中遇到了問題。

我少了文件我有。

.gradient(@startColor, @endColor) { 
    background: @startColor; 
    background: linear-gradient(to bottom, @startColor 0%,@endColor 100%); 
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='@{startColor}', endColorstr='@{endColor}',GradientType=1); 
} 

#nav { 
    .gradient(#fff,#e2ebef); 
} 

.btn { 
    .gradient(#f2f2f2, #e4e4e4); 
} 

編譯後，我得到這樣的：

#nav { 
    background: #ffffff; 
    background: linear-gradient(to bottom, #ffffff 0%, #e2ebef 100%); 
    filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ffffff', endColorstr='#e2ebef', GradientType=1); 
} 
.btn { 
    background: #f2f2f2; 
    background: linear-gradient(to bottom, #f2f2f2 0%, #e4e4e4 100%); 
    filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ffffff', endColorstr='#e2ebef', GradientType=1); 
} 

爲什麼在.btn的過濾器有相同顏色的#nav？我用Google搜索了一下，但沒有找到任何解決這個問題的方法。

所以...有沒有比在生成的CSS文件中手動粘貼顏色的另一種解決方案？

Answer 1

更改濾波器屬性來讀取這樣：

filter: ~"progid:DXImageTransform.Microsoft.gradient(startColorstr='@{startColor}', endColorstr='@{endColor}', GradientType=1)"; 

這自動地逸出許多無意義的在過濾器特性，並允許該字符串內的變量，以正確輸出。