使用LESS變量作爲一個屬性，而不是一個價值

Question

我做了以下兩種混合類型：

.responsive_color(@color, @response_color, @speed: 0.1s){ 
    color:     @color; 
    .transition(color, @speed); 

    &:hover, &:active, &:focus{ 
     color:     @response_color; 
    } 
} 

.responsive_background(@color, @response_color, @speed: 0.1s){ 
    background-color:  @color; 
    .transition(background-color, @speed); 

    &:hover, &:active, &:focus{ 
     background-color:  @response_color; 
    } 
} 

由於這兩個幾乎相同我想將它們合併爲這樣的事情：

.responsive(@property, @color, @response_color, @speed: 0.1s){ 
    @property:    @color; 
    .transition(@property, @speed); 

    &:hover, &:active, &:focus{ 
     @property:     @response_color; 
    } 
} 

雖然這不會導致LESS解析器（PHP類）中的錯誤，但它會被忽略。 我也嘗試過@ {property}和'@ {property}'，但這兩個都會導致錯誤。

有誰知道我可以輸出@property來正確解析？ 或者我想做一些不可能的事情？

Answer 1

一個類似的問題已經在這裏得到解答，可以幫助你。那種特定功能不在LESS.js框架（還），但你可以圍繞它可能得到一個小黑客，這裏概述：

How to pass a property name as an argument to a mixin in less

Answer 2

只是一個快速更新。現在該功能在那裏：

屬性可以插值，例如， @ {prefix} -property：value;
- Less.js 1.6.0 changelog

因此，如果你使用更少的1.6或更高版本，現在你可以真正做到這一點是這樣的：在this great SO answer

@{property}: @response_color; 

更多信息。