引导间距帮助器在不同的视口？

Question

我有下面的代码。

​

<section class="visit-section mb-7 mt-7 mb-sm-3 mt-sm-3 nb-md-5">
</section>

​

在Firefox中的开发工具中，当我选择带有选择器的元素时，它似乎没有识别mb-sm-3或mt 3类。换句话说，它正在添加的间距来自mb-7和mt-7。在找了30分钟之后，我不完全确定为什么会发生这种事。*-\

我从“引导4手册”中理解错了吗？自举手册

Answer 1

您的想法应该很好，但是我在代码中注意到的一些事情妨碍了它正常工作：

• 引导程序的间隔实用程序从0到5，就像在mb-0 | mb-5中一样，除非您自己指定了mb-7，否则没有mb-7。请参阅这里
• 请记住，sm断点适用于面向横向的智能手机；因此，您可能还没有触发正确的断点。

如果您在全屏上尝试下面的代码，您可以看到，当您调整浏览器窗口的大小时，页边距实际上会发生变化；我对您的代码所做的全部工作就是将mb-7类更改为mb-5，并修复最后一个类的错误。

​

section {
  height: 100px;
  background-color: red;
}

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet" />
<section class="visit-section mb-5 mt-5 mb-sm-3 mt-sm-3 mb-md-5">
</section>

<section class="visit-section mb-5 mt-5 mb-sm-3 mt-sm-3 mb-md-5">
</section>

​