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

Question

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

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

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

score 2 · Accepted Answer

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

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

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

要不就：

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

}

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

1 回答 1