Question

我正在用SimpLESS编译我的LESS，但是我认为这是一个如何使用&组合子的错误。这是标记：

<div class="parent">
  <div class="child-1 child-2">
    Hello
  </div>
</div>

基本的LESS代码：

.child-1 {
  color: red;
    .parent & {
    color: yellow;
    &.child-2 {
      color: blue;
    }
  }
}

预期的CSS输出：

.child-1 {
  color: red;
}
.parent .child-1 {
  color: yellow;
}
.parent .child-1.child-2 {
  color: blue;
}

SimpLESS的实际输出：

.child-1 {
  color: red;
}
.parent .child-1 {
  color: yellow;
}
.parent .child-1 .child-2 { // extra space between .child-1 and .child-2
  color: blue;
}

正如您所看到的，“Hello”是黄色还是蓝色的区别。哪个是正确的LESS编译？为什么SimpLESS会出错？

Answer 1

正确的输出是

.child-1 {
  color: red;
}
.parent .child-1 {
  color: yellow;
}
.parent .child-1.child-2 {
  color: blue;
}

所以你对自己的期望是正确的。您可以仔细检查是否访问http://less2css.org/，它是在＆＃34下链接的网站;立即尝试＆＃34;在http://lesscss.org/。

所以你可能在SimpLESS解析器中发现了一个错误。

SimpLESS中嵌套的＆符号

1 个答案: