Question

下面是示例少mixin代码

.mixin(@option) {
  .set(@options) when (@options = a){
    @type: linear;
  }

  .set(@option);

  background: -webkit-~'@{type}'-gradient(...);
}

输出

background: -webkit- linear -gradient(...);

如何删除linear周围的空格？

Answer 1

Less不支持通过值语句中的变量插值进行就地连接。你需要一个临时变量（在这个特殊情况下是一个辅助变量来处理parens），例如：

@end-func: ~')';

div {
    @func: ~'-webkit-@{type}-gradient(';
    background: @func ... @end-func;
}

Answer 2

尝试以下方法：

[功能较少]

.transition(@propValue) {

    -moz-transition: e(%("-moz-%a", @propValue));

    -webkit-transition: e(%("-webkit-%a", @propValue));

    -ms-transition: e(%("-ms-%a", @propValue));

    transition: @propValue;

}

[CSS]

.transition(e("transform 0.5s ease"));

[输出]

-moz-transition: -moz-transform 0.5s ease;

-webkit-transition: -webkit-transform 0.5s ease;

-ms-transition: -ms-transform 0.5s ease;

transition: transform 0.5s ease;

当LESS变量值为字符串时删除空格

2 个答案: