css - LESS：如何用嵌套指定当前标签？

Question

我有下一个 CSS：

.button {
    background-color: black;
    border-radius: 4px;
    color: white;
}

a.button {
    text-decoration: none;
    color: white;
}

我想用 LESS 重新制作它，例如：

.button {
    background-color: black;
    border-radius: 4px;
    color: white;

    a& {
        text-decoration: none;
        color: white;
    }
}

但它会生成下一个（错误的）CSS：

.button {
    background-color: black;
    border-radius: 4px;
    color: white;
}

/* unexpected space */
a .button {
    text-decoration: none;
    color: white;
}

我怎样才能做到正确？

Answer 1

这些元素不一定是嵌套的，因此 LESS 嵌套不适用。

Answer 2

这完全是版本问题。正如@freejosh 评论的那样，它已在 LESS 的最新版本中得到解决。如果您将上面的代码带到http://less2css.org/那么它工作正常（运行 LESS 1.3.3，尽管您可以将版本更改为 1.3.0 并看到它不再像您期望的那样运行并放置中的空间）。

由于您声明您正在运行 lessc 1.3.0，因此您需要升级您的 LESS 版本。

Answer 3

它不漂亮，但它有效！:)

.button {
    background-color: black;
    border-radius: 4px;
    color: white;
}

a,b,other{
    &.button{
        .button;
        text-decoration: none;
        color: white;
    }
}