当前位置 : 主页 > 网页制作 > css >

css – 使用mixin参数在LESS中创建类名

来源:互联网 收集:自由互联 发布时间:2021-06-13
我正在尝试在LESS中创建一个简单的mixin,用于我将用于网站的不同颜色. 我想要的是使用mixin参数作为类名的一部分. @green: #5FBEAA; // my color variable.text-color(@color) { .text-{@color} { color: @color
我正在尝试在LESS中创建一个简单的mixin,用于我将用于网站的不同颜色.

我想要的是使用mixin参数作为类名的一部分.

@green: #5FBEAA; // my color variable

.text-color(@color) {
    .text-{@color} {
        color: @color;
    }
}

.text-color(@green);

我得到的输出是:

.text-#5FBEAA {
  color:#5FBEAA
}

我想要的是:

.text-green {
  color:#5FBEAA
}
我想我有使用 Variable Names的解决方案.

@green: #5FBEAA;

.text-color(@colorname) {
  @color: ~"@{colorname}";
  .text-@{color}{
    color: @@color;
  }
}

.text-color(green);

产量

.text-green {
  color: #5FBEAA;
}
网友评论