css - Jasny-Bootstrap在lessfile中使用“.offcanvas-sm”

我想使用.offcanvas-sm分配给Less文件的<nav>元素。 Less文件如下所示：

@import "../../jasny-bootstrap.less";
.test {
  .offcanvas-sm;
}

问题是较少处理器说-类offcanvas-sm不存在。它来自“ jasny-bootstrap.less”中包含的“ https://github.com/jasny/bootstrap/blob/master/less/offcanvas.less”文件。但是如何将这段代码导入一个类？

最佳答案

那里的编译器是正确的，实际上.offcanvas-sm在您尝试调用它的上下文中不存在。这里的关键词是范围：在媒体查询中定义的选择器只能在同一媒体查询块中用作混合。

对于这种特殊情况，extend将解决问题。 extend的作用域处理与mixin的作用域正交，因此在媒体查询块中定义的选择器可以从外部作用域“扩展”（但不是相反）：

.test {
    &:extend(.offcanvas-sm all);
}

要不就：

.test:extend(.offcanvas-sm all) {

}

---

在这种情况下，必须使用all关键字，因为.offcanvas-sm样式实际上是两个规则集的集合：.offcanvas-sm和.offcanvas-sm.in

关于css - Jasny-Bootstrap在lessfile中使用“.offcanvas-sm”，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/27030587/