html - Bootstrap hidden-sm-down 不工作

Question

我正在使用 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>

Answer 1

实际上，hidden-sm-down 不适用于 Bootstrap 4 及更高版本
(那里使用 d-none 而不是 hidden-sm-down，并使用 d-sm-none 而不是 hidden-sm -向上,另见 understanding-details ).

在 BS4 中，显示实用程序类完全改变了。请改用此格式；

.d-{breakpoint}-{value}

更多信息； https://getbootstrap.com/docs/4.0/utilities/display/