bootstrap4的容器类,bootstrap常用的容器类,bootstrap中container-fluid,bootstrap container容器,bootstrap布局容器,bootstrap中的container
Bootstrap 5 (BS5) 容器是一种用于包装内容的 CSS 类，它可以帮助在不同屏幕大小下进行布局和响应式设计。容器有三种类型：.container、.container-fluid 和 .container-xxl（其中 xxl 是 BS5 新增的）。这些容器定义了宽度、最大宽度和填充，以便在不同设备上实现一致的外观和排版。

.container 容器根据屏幕大小设置固定的宽度，可以在中等和大屏幕上使用，但在小屏幕上可能会出现水平滚动条。.container-fluid 可以占据所有可用空间，适合于小屏幕设备。.container-xxl 是一个新的容器类型，它适用于更大的屏幕，比如桌面电脑或显示器。

以下是示例代码：

html
<div class="container">
<div class="row">
<div class="col-md-6">左侧内容</div>
<div class="col-md-6">右侧内容</div>
</div>
</div>

<div class="container-fluid">
<div class="row">
<div class="col-sm-4">菜单</div>
<div class="col-sm-8">主要内容</div>
</div>
</div>

<div class="container-xxl">
<p>大屏幕专属内容</p>
</div>


在上述示例中，第一个容器使用 .container 类定义，并包含两个等宽的列。第二个容器使用 .container-fluid 类定义，并且包含菜单和主要内容部分。最后，第三个容器使用了 .container-xxl 类定义，只包含一个段落元素。