LESS:在媒体查询中访问类作为mixin

Question

假设有一个像这样的声明(它实际上是Bootstrap):

@media screen and (min-width: 768px) {
  .navbar {
    padding-top: 0;
  }
}

是否可以像访问其他类或mixin一样访问此媒体查询中的.navbar(它还有一个声明在它之外)？我想在其他地方重新使用它的声明(好吧,不完全是这个,但你明白了:-)),例如:

.left-nav {
    .navbar; // Use the one from the media query here.
}

LESS可以实现吗？

我已经看到了一个非常相似的问题,虽然这里的区别在于我不能重构 .navbar在媒体查询之外,因为这是在Bootstrap的LESS文件中.我理解帽子LESS并不关心媒体查询,因为它们只是另一种选择器; 但是如何在这些选择器中访问声明(我尝试了一些明显的但没有奏效).

任何帮助,将不胜感激.

Answer 1

我不知道除了自身之外还有什么方法可以做到@media，例如：

这个少

@media screen and (min-width: 768px) {
  .navbar {
    padding-top: 0;
  }
  .left-nav {
    .navbar; // Use the one from the media query here.
  }
}

.navbar {
  padding: 20px;
}

生成此 CSS

@media screen and (min-width: 768px) {
  .navbar {
    padding-top: 0;
  }
  .left-nav {
    padding-top: 0;
  }
}
.navbar {
  padding: 20px;
}

我相当确定这不是您想要做的。

但是，我相信，由于@media本身不是一个选择器（它是浏览器的查询字符串），因此它本身不能作为 mixin 或 LESS 中的命名空间来访问，因此它的内容无法以这种方式访问你渴望。

如果我错了，我希望有人能以其他方式发布答案——但我没想到会这样。