javascript - 如何禁用不同大小的 Html 代码？

Question

我想禁用一些我想要的指定大小的 Html 代码，例如我想禁用或编辑一个大小为 576px 的类容器的 div，这是我的代码。

---

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">

<div class="container">
                 <div class="row">
                        <div class="col-2 col-sm-1 col-md-1 col-lg-2">
                            <div>
                                <a>Some codes</a>
                            </div>
                        </div>
                        <div class="col-8 col-sm-9 col-md-9 col-lg-8">
                            <div>
                                <nav>
                                    <ul class="cf--main-menu-wrapper">
                                        <li><a href="#">Home</a></li>
                                        
                                        <li><a href="#">Pricing</a></li>
                                        <li><a href="#">Our Features</a></li>
                                    </ul>
                                </nav>
                            </div>
                        </div>
                        <div class="col-2 col-sm-2 col-md-2 col-lg-2">
                            <div>
                                <a>Download App</a>
                            </div>
                        </div>
                    </div>
        </div>

---

我在这个问题中提到了一个 div，但我指的是每个 html 代码。谢谢。

Answer 1

这可以通过使用像这样的媒体查询来实现

@media screen and (max-width: 576px) {
    .container {
        display: none;
    }
}

您可以使用媒体查询禁用所需代码的任何部分。