Question

我有以下代码。

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

在Firefox的开发人员工具中，当我使用选择器选择元素时，似乎无法识别mb-sm-3或mt-sm-3类。换句话说，它添加的间隔是从mb-7和mt-7。看了30分钟后，我不完全确定为什么会这样。：-\

我是否从Bootstrap 4手册中理解错了？ Bootstrap Manual

Answer 1

您的想法应该运行良好，但是我在您的代码上注意到了几件事，使它无法正常运行：

引导程序的间距实用程序从0到5，与mb-0 | mb-5一样，除非您自己指定，否则没有mb-7。参见here
请记住，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>

Bootstrap Spacing Helper位于不同的视口？

1 个答案: