css - 在 LESS 导入中的选择器内引导媒体查询？

Question

我正在尝试将 Bootstrap 应用于特定的 div。为此，我将导入 Boostrap LESS 文件，如下所示：

.bootstrap_wrap {
    @import 'bootstrap/bootstrap.less'; 
    @import 'bootstrap/responsive.less';    
}

但是，这样做似乎会破坏媒体查询。

有什么方法可以选择性地应用 Boostrap 而不会破坏 Boostrap CSS 中的媒体查询？

Answer 1

我不清楚你是在编译这个还是在使用 less.js

我能够毫无错误地编译它（使用 Codekit），结果看起来不错，只需确保路径正确即可。

如果我创建一个新的 bootstrap_wrap.less 文件

.bootstrap_wrap {
@import 'bootstrap.less';
@import 'responsive.less';  

}

并将其放在与其他 bootstrapless 文件相同的目录中，然后对其进行编译，结果如下：
bootstrap_wrap.css

结果对我来说看起来很有希望，例如我看到：

@media (max-width: 767px) {
.bootstrap_wrap #footer {
margin-left: -20px;
margin-right: -20px;
padding-left: 20px;
padding-right: 20px;
}
}

祝你好运！