css - 在 LESS CSS 中使用通用选择器作为 mixin

Question

我知道混入和参数混入。我们正在寻找的是一种将 CSS/LESS 中的任何通用选择器变成混合的方法。

例如 Twitter BootStrap , 我们有 here

.navbar .nav > li {
  float: left;
} 

如果我必须在类里面使用它，比如 .mynavbar 我希望能够做到这一点

INPUT->
.mynavbar {
  .navbar .nav >li;
}

---

OUTPUT->
.mynavbar {
  float:left;
}

现在我知道这不能用当前版本的 LESS 完成，因为编译器会标记解析器错误。我希望有人帮助我稍微更改 less.js 的源代码，以便它可行。

我已经成功到达了 the source code for the mixin parser .我试过在那里更改 RegExp，但它会干扰解析器的其他部分。我知道我们只需要做一些改变，因为我们必须接受任何混合，比如标签/属性选择器，比如 ，而不是仅仅接受 .mixin 和 #mixin输入[type=text].

目前需要开发一个使用Bootstrap的UI框架。不幸的是，bootstrap 中的许多地方都散布着直接标记选择器而不是 id 和类。

Answer 1

这是可能的 since version 1.4.0 (2013-06-05)包含 extend 功能的 LESS。基于原始示例

.navbar .nav > li {
  float: left;
}

.mynavbar:extend(.navbar .nav > li) {}

编译为

.navbar .nav > li,
.mynavbar {
  float: left;
}

文档 here以及原始问题的讨论和示例使用 here

编辑:添加了代码示例