Bootstrap 4“隐藏”类不起作用

Question

我正在使用 Bootstrap v4 及其默认的 CSS 和 JS。我正在尝试将类 hidden 、 hidden-XX-down 和 hidden-XX-up 到各种 div、按钮等，但它似乎没有任何影响。所有其他课程都有效，除了这个。

这是一个例子：

 <div class="row">

  <div class="col col-10 offset-1 hidden-sm-down">

    <p class="text-primary text-center">Lorem ipsum dolor sit amet.</p>

  </div>

</div>

当我将窗口调整为更小的宽度（sm-down）时，我希望该段落不可见，但它仍然可见并且没有任何反应。

原文由 user9179774 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

使用 d-none , d-sm-none , d-md-none 等。

https://getbootstrap.com/docs/4.0/utilities/display/

要仅显示 md up（隐藏 sm down），请使用：

 <div class="d-none d-md-block"></div>

原文由 hayden 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

好吧，使用 display 属性绝对解决了问题。

如果有人想知道为什么 hidden 类不起作用，这很简单……它们不再存在于 Bootstrap 版本 4 中。这就是您从观看旧教程视频中得到的。

原文由 user9179774 发布，翻译遵循 CC BY-SA 3.0 许可协议