Bootstrap 5 容器
Bootstrap 5 容器
Bootstrap 5 是一个流行的前端框架，用于快速开发响应式和移动设备优先的网页。在 Bootstrap 5 中，容器是布局的基础，用于容纳页面内容并使其居中。本文将详细介绍 Bootstrap 5 中的容器，包括其用途、样式和如何使用。
容器简介
在 Bootstrap 5 中，容器是用于包裹页面内容的元素。它们确保内容在不同屏幕尺寸上都能正确显示，并且居中。Bootstrap 5 提供了两种容器：
- 固定容器（
.container）：具有固定的宽度，随着屏幕尺寸的变化而变化。 - 流体容器（
.container-fluid）：宽度为 100%，随着屏幕尺寸的变化而变化。
固定容器
固定容器是 Bootstrap 5 中的默认容器。它具有以下特点：
- 在超小屏幕（<576px）上，容器的宽度为 100%。
- 在小屏幕（≥576px）上，容器的宽度为 540px。
- 在中等屏幕（≥768px）上，容器的宽度为 720px。
- 在大屏幕（≥992px）上，容器的宽度为 960px。
- 在超大屏幕（≥1200px）上，容器的宽度为 1140px。
要使用固定容器，只需在 HTML 代码中添加一个带有 container 类的 div 元素：