将LESS:extend（）与：lang（）一起使用

我在一个多语言网站css上工作，每个UI组件都有基于不同语言的不同字体参数。使用mixin创建输出是可行的，但会生成重复的代码。我正在寻找一个更好的解决方案，它支持：lang（）和继承

少

注意：在mixin中设置：lang（）的原因是为了将来能够根据需要禁用它们

CSS输出

.comp {
  color: red;
  font-size: 54px;
  font-size: 5.4rem;
  line-height: 1;
}
.comp:lang(zh-CN) {
  color: red;
  font-size: 36px;
  font-size: 3.6rem;
  line-height: 1.3;
  font-weight: 300;
}
.comp:lang(zh-TW) {
  color: green;
  font-size: 36px;
  font-size: 3.6rem;
  line-height: 1.3;
  font-weight: 300;
}
.comp:lang(ko) {
  color: blue;
  font-size: 36px;
  font-size: 3.6rem;
  line-height: 1.3;
  font-weight: 300;
}
.comp:lang(ja) {
  color: yellow;
  font-size: 36px;
  font-size: 3.6rem;
  line-height: 1.3;
  font-weight: 300;
}

预期产量

.comp {
  color: red;
  font-size: 54px;
  font-size: 5.4rem;
  line-height: 1;
}
.comp:lang(zh-CN),.comp:lang(zh-TW),.comp:lang(ko),.comp:lang(ja) {
  font-size: 36px;
  font-size: 3.6rem;
  line-height: 1.3;
  font-weight: 300;
}
.comp:lang(zh-CN) {
    color: red;
}
.comp:lang(zh-TW) {
  color: green;  
}
.comp:lang(ko) {
  color: blue;
}
.comp:lang(ja) {
  color: yellow;
}

答案（“使用”）已经在你的Q标题中

即（首先是简化而非优化的示例）：

.comp{
.字号（5.4）；
线高：1；
.cjk-font-size\u{
.字号（3.6）；
线高：1.3；
字体大小：300；
}
.lang（zh CN，{颜色：红色}）；
.lang（zh-TW，{颜色：绿色}）；
.lang（ko，{颜色：蓝色}）；
.lang（ja，{颜色：黄色}）；
.lang（@lang，@style）{
&：lang（@{lang}）{
&：扩展（.comp.cjk-font-size\uuuux）；
@风格（）；
}
}
}
.font-size（@size）{
字体大小：（10px*@size）；
字体大小：（1rem*@size）；
}

.comp {
  color: red;
  font-size: 54px;
  font-size: 5.4rem;
  line-height: 1;
}
.comp:lang(zh-CN),.comp:lang(zh-TW),.comp:lang(ko),.comp:lang(ja) {
  font-size: 36px;
  font-size: 3.6rem;
  line-height: 1.3;
  font-weight: 300;
}
.comp:lang(zh-CN) {
    color: red;
}
.comp:lang(zh-TW) {
  color: green;  
}
.comp:lang(ko) {
  color: blue;
}
.comp:lang(ja) {
  color: yellow;
}