less语法与@@意义 [英] Less syntax with @@ meaning

问题描述

我已经下载了一个主题为bootstrap和在他们较少的来源我有一个混合像：

  .label-color @color）{
 @ label-class：〜label  -  @ {color}; 
 @ badge-class：〜badge  -  @ {color}; 
 @ label-color：@@ label-class; 
 
。@ {label-class}，。@ {badge-class} {
 background-color：@ label-color！important; 
} 
} 
 
 .label-arrow（@color）{
 @ label-class：〜label  -  @ {color}; 
 @ label-color：@@ label-class; 
 
。@ {label-class} {
& .arrowed：before {
 border-right-color：@ label-color; 
} 
& .arrowed-in：before {
 border-color：@ label-color; 
} 
& .arrowed-right：after {
 border-left-color：@ label-color; 
} 
& .arrowed-in-right：after {
 border-color：@ label-color; 
} 
} 
} 
 .label-color（〜lime）; 
 .label-color（〜red）; 
  

我的问题是 @ label-color：@@ label-class;因为我的内部编译器 less4j 在这个双重 @@ 我不明白为什么。本地编译器 Crunch 是工作，知道编译，所以不是一个错误的语法。

解决方案

正如@deceze已经提到的，你可以阅读 http://lesscss.org/features/#variables-feature-variable-names，双$ @ 将用于在Less中创建变量变量名：

例如：

  @red：darkred; 
 @color：red; 
 p {
 color：@@ color; 
} 
  

输出：

  p {
 color：darkred; 
} 
  

请注意，变量名称（@color）应为字符串。 p>

上面的代码也应该在less4j中工作，可以在 https://github.com/SomMeri/less4j/wiki/Less-Language-Variables ：

如果变量包含一个字符串，那么它可以作为
另一个变量的引用。

I have downloaded a theme for bootstrap and In their less sources I have a mixin like:

.label-color(@color) {
  @label-class:~"label-@{color}";
  @badge-class:~"badge-@{color}";
  @label-color:@@label-class;

 .@{label-class}, .@{badge-class} {
    background-color:@label-color !important;
 }  
}

.label-arrow(@color) {
   @label-class:~"label-@{color}";
   @label-color:@@label-class;

  .@{label-class}{
    &.arrowed:before {
        border-right-color:@label-color;
    }
    &.arrowed-in:before {
        border-color:@label-color;
    }
    &.arrowed-right:after {
        border-left-color:@label-color;
    }
    &.arrowed-in-right:after {
        border-color:@label-color;
    }
  }
}
.label-color(~"lime");
.label-color(~"red");

My problem is that @label-color:@@label-class; because my internal compiler less4j give me error at this double @@ and I don't understand why. Local compiler Crunch is working and know to compile that so is not a wrong syntax. Can someone give me a hint pls, ty.

解决方案

As already mentioned by @deceze, you can read at http://lesscss.org/features/#variables-feature-variable-names that the double @ will be use to create a variable variable name in Less:

For instance:

@red: darkred;
@color: "red";
p {
color: @@color; 
}

Outputs:

p {
  color: darkred;
}

Notice that the variable name (@color) should be a string.

The above should also work in less4j according the docs which can be found at: https://github.com/SomMeri/less4j/wiki/Less-Language-Variables:

If the variable contains a string, then it can act as a reference to another variable.

这篇关于less语法与@@意义的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！