CSS @import在一个类中

Question

我正在尝试执行以下操作：

.bootstrap-scope { 
  @import "bootstrap.min.css";
}

我知道bootstrap.min.css位于正确的位置，因为将@import "bootstrap.min.css";放在css页面的顶部可以正常工作。

无论如何，重点是能够确定受引导程序影响的范围。我想bootstrap只适用于封闭的div

<div class="bootstrap-scope">
...
</div>

有什么想法吗？这似乎应该是直截了当的。

this post建议将导入放在一个类中。有没有其他选择？

Answer 1

你不能在CSS规则中@import。 @import语句必须在任何选择器之外声明。

来自the MDN page on @import：

  

@import CSS at-rule允许从其他样式表导入样式规则。除@charset规则外，这些规则必须先于所有其他类型的规则;因为它不是嵌套语句，所以不能在条件组at-rules中使用。

此类功能需要嵌套选择器，CSS中不存在这些选择器。你必须在LESS或SASS中编写这样的东西，然后将它预处理成CSS。

您的链接问题建议创建一个导入Bootstrap的LESS代码的LESS文件，然后将其编译为CSS。