Bootstrap 4参考手册
布局 | Layout
排版通用类别 | Utilities for layout
为了加速移动友好和响应式开发,Bootstrap 包含数十个实用工具类,用于显示,隐藏,对齐和分隔内容。
改变display
使用我们的display
实用程序来响应地切换display
属性的常见值。将其与我们的网格系统,内容或组件混合以在特定视口中显示或隐藏它们。
Flexbox 选项
Bootstrap 4 使用 flexbox 构建,但并非每个元素display
都已更改为,display: flex
因为这会增加许多不必要的覆盖,并意外更改关键浏览器行为。我们的大多数组件都是使用 Flexbox 启用的。
如果您需要添加display: flex
到元素,请使用.d-flex
或使用其中一种响应变体(例如,.d-sm-flex
)。您将需要此类或display
值来允许使用我们的额外Flexbox实用程序来调整大小,对齐方式,间距等。
边缘和填充
使用margin
和padding
间距实用程序来控制元素和组件的间距和大小。引导程序4包含基于1rem
值默认$spacer
变量的用于间隔工具的五级缩放。为所有视口选择值(例如,.mr-3
for margin-right: 1rem
),或选择响应变体以针对特定视口(例如,.mr-md-3
用于margin-right: 1rem
从md
断点开始)。
切换 visibility
当display
不需要切换时,可以visibility
使用我们的可见性实用程序切换元素。不可见的元素仍然会影响页面的布局,但在视觉上对访客隐藏。
布局 | Layout相关
Bootstrap 是一套用于 HTML、CSS 和 JS 开发的开源工具集。利用我们提供的 Sass 变量和大量 mixin、响应式栅格系统、可扩展的预制组件、基于 jQuery 的强大的插件系统,能够快速为你的想法开发出原型或者构建整个 app 。
主页 | https://getbootstrap.com/ |
源码 | https://github.com/twbs/bootstrap |
版本 | 4 |
发布版本 | 4.0.0-beta.2 |