嵌套在 bootstrap 4 上 ipad 横向

Question

除了 ipad-landscape 之外，我有一些嵌套内容在所有屏幕上都可以正常工作。在 ipad-landscape 上触发的 class 不应该是 col-sm 而不是 col-lg 吗？

<div class="row">
    <div class="col-lg-3 col-sm-8 offset-sm-1">
        <div class="row">
            <div class="col-sm-12">
                <div>
                    //content
                </div>
            </div>
            <div class="col-sm-12">
                <div>
                    //content
                </div>
            </div>
        </div>
    </div>
</div>

Answer 1

没错，是lg，不是sm，因为--
首先让我们检查 ipad 的尺寸，可以在 chrome 开发工具的响应选项卡中看到。
Responsive tab open in chrome dev tools

这里提到的 ipad 在横向模式下的尺寸是 1024 x 768，即 1024 宽和 768 高。
现在，移动到 Bootstrap4 Grid Docs，正如您在 table 中看到的那样，Large ≥ 992px，这意味着宽度超过 992px 的设备将获得 lg class。

注意：boostrap 文档中提到的所有尺寸都是相对于页面宽度的。
我使用宽度的理论是，因为对于大多数网站来说，内容需要水平和垂直适合数据，它可能会溢出。