Bootstrap5网格系统详解：容器、行、列与断点设置

Bootstrap5网格系统基于12列布局理念，快速实现响应式网页布局。核心为“容器-行-列”三级结构：容器是布局边界，有固定宽度居中的.container和全屏的.container-fluid两种；行用于包裹列，抵消容器内边距并通过flex实现自动换行，必须嵌套在容器内；列是内容单元，宽度由.col-[断点]-[列数]类控制（1-12列），断点含sm（≥576px）、md（≥768px）等，默认占12列或按断点自动调整。列间距可通过.gap-*类修改，内容对齐支持文字（text-*）和垂直（align-items-*）方向控制。无需手动写媒体查询，类名组合即可适配手机、平板、电脑等设备。