Question

使用SASS我已经能够编写使用插值来创建基于变量的mixin的代码：

@mixin browserPrefix($property, $value) 
  -webkit-#{$property}: $value
  -moz-#{$property}: $value
  -ms-#{$property}: $value
  -o-#{$property}: $value
  #{$property}: $value

这非常灵活，因为我可以简单地编写@include browserPrefix（$ property：border-radius，$ value：3px）并在编译时获取所有浏览器前缀。这包括允许多种不同的用途。

有没有办法用LESS做到这一点？我已经尝试使用@ {property}作为替换，但它似乎不起作用。任何建议请让我知道，对LESS来说很新。

Answer 1

简单回答尚未。

但似乎可能很快（也许在下一个LESS版本中）。看到此主题 https://github.com/less/less.js/issues/36 ，好像@ seven-phases-max目前正在处理它（ see here ）

所以只有一点点耐心=）

我刚才发布了一个可能的解决方法：

Using variables in property names in LESS (dynamic properties / property name interpolation) （有点hacky但有效，等待LESS中正式发布的属性插值）

更新

从LESS 1.6（changelog）开始，属性名称插值是可能的你的mixin在LESS中看起来像这样：

.browserPrefix(@property; @value){
    -webkit-@{property}: @value;
       -moz-@{property}: @value;
        -ms-@{property}: @value;
         -o-@{property}: @value;
            @{property}: @value;
}

你可以使用变量作为CSS属性和值与LESS？

1 个答案:

更新