布局实用程序

更改 display

使用我们的 显示实用程序 响应式切换 display 属性的常用值。 将其与我们的网格系统、内容或组件混合使用，以在特定视口中显示或隐藏它们。

Flexbox选项

Bootstrap 是使用 flexbox 构建的，但并非每个元素的 display 都已更改为 display: flex，因为这会添加许多不必要的覆盖并意外更改关键浏览器行为。 我们的组件 大部分都是在启用 flexbox 的情况下构建的。

如果您需要将 display: flex 添加到元素，请使用 .d-flex 或响应式变体之一（例如，.d-sm-flex）。 你需要这个类或 display 值来允许使用我们额外的 flexbox 实用程序 来调整大小、对齐、 间距等。

外边距和内边距

使用 margin 和 padding 间距实用程序 来控制元素和组件的间距和 大小。 Bootstrap 基于 1rem 值默认 $spacer 变量包括六级间距实用程序。 为所有视口选择值（例如，.me-3 用于 LTR 中的 margin-right: 1rem），或选择响应式变体以定位特定视口（例如， .me-md-3 for margin-right: 1rem — 在 LTR — 从 md 断点开始）。

切换 visibility

当不需要切换 display 时，您可以使用我们的 可见性实用程序来切换元素的 visibility 。 不可见的元素仍然会影响页面的布局，但在视觉上对访问者是隐藏的。