我正在使用 Boostrap 3。为什么 <div>
与 hidden-sm-down
当我在笔记本电脑上调整页面大小时仍然可见?我想在小型设备上隐藏这两个图像,以便有不同的菜单。
<div class="row">
<div class="col-md-7 left">
<ul class="row">
<li class="col-md-2">
<a href="">Text</a>
</li>
<li class="col-md-2">
<a href="">Text</a>
</li>
<li class="col-md-3">
<a href="">Text</a>
</li>
<li class="col-md-3">
<a href="">Text</a>
</li>
<li class="col-md-2">
<a href="">Text</a>
</li>
</ul>
</div>
<div class="col-md-1 hidden-sm-down wave">
<img src="img/ondina.png" />
</div>
<div class="col-md-3 right">
<ul class="row">
<li class="col-md-6">
<a href="">Text</a>
</li>
<li class="col-md-6">
<a href="">Text</a>
</li>
</ul>
</div>
<div class="col-md-1 hidden-sm-down right-border">
<img src="img/menu-right.png" />
</div>
</div>
最佳答案
实际上,hidden-sm-down
不适用于 Bootstrap 4 及更高版本
(那里使用 d-none
而不是 hidden-sm-down
,并使用 d-sm-none
而不是 hidden-sm -向上
,
另见 understanding-details ).
在 BS4 中,显示实用程序类完全改变了。请改用此格式;
.d-{breakpoint}-{value}
关于html - Bootstrap hidden-sm-down 不工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37764794/