html - Bootstrap4 上的 hidden-sm-down 不起作用

标签 html css bootstrap-4

我试图让我的图片在 m+ 设备上位于文字上方,在 sm- 设备上位于文字下方。我正在使用 Bootstrap4,据我所知,我遵循了 Bootstrap 提供的所有教程 - 但它并没有隐藏我的图像。提前感谢您的帮助。

这是我的代码:

<div class="container">
<div class="row">
<div class="hidden-sm-down">
<div class="col-md-6">
<img class="img-fluid" src="img/finding.svg" onerror="this.src='img/finding.png';this.onerror=null;" alt="">
</div>
</div>
<div class="col-md-6 col-sm-12">
<h5 class="heading">Get SMS notifications for new dates</h5>
<p class="sell">
This is where the text would go.
</p>
</div>
<div class="hidden-md-up">
<div class="col-md-6">
<img class="img-fluid" src="img/finding.svg" onerror="this.src='img/finding.png';this.onerror=null;" alt="">
</div>
</div>
</div>
</div>

最佳答案

这是因为类 hidden-sm-downhidden-sm-up 不再存在于 Bootstrap 4 Beta 3 中。

使用 d-sm-none 等代替 hidden-sm-up

完整列表在这里:

https://getbootstrap.com/docs/4.0/utilities/display/#hiding-elements

关于html - Bootstrap4 上的 hidden-sm-down 不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48272316/

相关文章:

javascript - 如何防止在另一个页面上的导航上发生点击事件

javascript - Controller 和 HTML 之间的 AngularJs ng-model 延迟

html - 将 Div 水平和垂直居中

javascript - AngularJS 复杂表设计与 ngRepeat

css - 如何在 Material ui 网格中设置断点以使其响应

jquery - Bootstrap carousel 一次传送多个帧

css - 为什么 child flex div 会向 parent 拉伸(stretch)?

JavaScript Date() 返回无效日期

javascript - html 图像何时开始下载数据?

javascript - Div 动画不会向下平移