为什么 Bootstrap 列在 XS 尺寸下无法正确换行？

最小尺寸 (XS) 的 Bootstrap 列包裹

Bootstrap 是一个流行的前端框架，提供了一个响应式网格系统，允许开发人员创建灵活的布局，调整以适应不同的屏幕尺寸。然而，使用最小尺寸断点 (XS) 时遇到的一个常见问题是，当屏幕宽度减小到超过一定限制时，列不会按预期换行。

出现此问题的原因是列的组合宽度为 12 （例如，

已知问题：

此问题已得到确认Bootstrap GitHub 存储库中：https://github.com/twbs/bootstrap/issues/13221。

解决方案：

要避免此问题，请考虑以下事项建议：

• 不要在非常小的屏幕上使用 .col-xs-1 列： 相反，使用较大的列，例如 .col-xs-2 或 .col-xs -3.
• 考虑屏幕尺寸：确定屏幕大小是否会实际调整到 360 像素以下。在大多数情况下，这是不可能的。

Bootstrap 4 注意：

在 Bootstrap 4 中，.col-xs-1 已重命名为 .第 1 栏。在宽度小于 360 像素的屏幕上，.col-1 列也可能会出现同样的问题。

相关问题：

Bootstrap 用户也报告了类似的网格问题以最小尺寸打破：https://stackoverflow.com/questions/29385993/bootstrap-grid-breaks-in-smallest-size

以上是为什么 Bootstrap 列在 XS 尺寸下无法正确换行？的详细内容。更多信息请关注PHP中文网其他相关文章！