使用LESS mixin添加供应商前缀

Question

这个混合我得到一个语法错误:

.vendors(@statement){
  @statement;
  -moz-@statement;
  -webkit-@statement;
}

任何方式做到这一点,或做mixin变量必须在一个:？的右侧？

Answer 1

从Less v2开始,您可以使用autoprefix插件为您的属性添加前缀,这似乎是一个更好的选择.autoprefix插件利用autoprefixer后处理器添加浏览器前缀.对于客户端编译(在浏览器中),您可以使用-prefixfree.

正如@ScottS 在这里已经提到的那样,你可以在选择器中使用变量插值,因为Less v1.6可以让你做到:

.prefix(@property, @value)
{
    -webkit-@{property}:@value;
    @{property}:@value;
}
selector {
    .prefix(property,value);
}

输出:

selector {
  -webkit-property: value;
  property: value;
}