重复利用LESS嵌套样式

Question

假设我使用Less定义了一个样式：

ul.unstyled,
ol.unstyled {
  margin-left: 0;
  list-style: none;
}

稍后，我想重新使用“未经样式处理的”类：unstyled。

.my-list {
  .unstyled;
}

然而这并不起作用，我无法想出让它起作用的方式。有什么想法吗？

- Brian Genisio

Answer 1

您无法重复使用任意类定义，只能重复使用混合类（以点号开头的那些）。在这种情况下，您需要进行复制。

- Christoph Leiter

---

这是否意味着当您定义.myClass时，LESS会创建一个无参数的mixin？ - Dennis Burton

好问题。我认为可以，因为根据文档，mixins 只是类：“混入允许您通过将类名称作为其属性之一来将类的所有属性嵌入到另一个类中。就像变量一样，但适用于整个类”。 - Christoph Leiter

Answer 2

试试这个：

.unstyled {
  margin-left: 0;
  list-style: none;
}

.my-list {
  .unstyled;
}

如果将.unstyled定义为ul.unstyled和ol.unstyled，则无法嵌套。

- Alex Bain

---

这对我不起作用，因为我不拥有原始定义...换句话说，unstyled类是在Bootstrap.less中定义的，我想避免调整依赖关系。相反，我想知道如何重用嵌套样式。 - Brian Genisio

啊，如果你不能/不想覆盖那些样式，我不确定你能否按照自己的意愿重用它。LESS 不允许你将 "ul.unstyled" 或类似的内容作为嵌套类来指定。你可以创建一个 mixin，但那样会重复代码。 - Alex Bain

Answer 3

由于当 .unstyled 作为嵌套样式时无法重复使用，而您可能不想编辑 Bootstrap 源代码，因此建议您将这两个类名都分配给您的列表：

<ul class="unstyled my-list" />

- Sander