Mixins：执行有问题

Question

是否可以从此mixins中仅选择border-top。 现在我只需要顶部边框，但是想收集它们以便使用。我想对每个边框使用单独的mixin是错误的，

 .bordered(@top-width: 1px, @top-color: #fff, @bottom-color: #fff) { 
     border-top: @top-width solid @top-color; 
     border-left: @top-width solid @left-color; 
     border-right: @top-width solid @right-color; 
     border-bottom: @top-width solid @bottom-color; }

我希望使用相同的mixins来获得此输出

.class1{border-top:6px solid red;}
.class2{border-bottom:1px solid white;} 

由于

Answer 1

您可以创建一个mixin，您可以传入所需的边框类型。这样你就可以有一个你多次调用的mixin。

此mixin使用属性插值，可在Less v1.6 +

中使用

http://lesscss.org/features/#variables-feature-properties

.border(@property; @value){
  border-@{property}: @value;       
}

.bacon {
  .border(top; 1px solid black);
}

// Outputs
.bacon {
  .border-top: 1px solid black;
}