Bootstrap5折叠面板：节省空间的内容展开/收起

这篇文章介绍了Bootstrap5折叠面板的使用。折叠面板是网页中隐藏内容以节省空间的交互组件，常见于FAQ等场景。Bootstrap5无需复杂JS，通过HTML类名和data属性即可实现，支持手风琴等效果。 使用需先引入Bootstrap5的CSS和JS（CSS在前，JS在后）。基础面板包含触发按钮（`data-bs-toggle="collapse"`+`data-bs-target="#xxx"`）和折叠内容（`class="collapse"`，`show`类可默认展开）。手风琴效果通过`data-bs-parent`指定父容器实现，同一时间仅展开一个面板。 可通过修改类名自定义样式，如按钮颜色或添加图标。核心是`data-bs-target`关联ID、`data-bs-parent`控制互斥，以及`show`类控制默认展开。适用于FAQ、产品详情等场景，使用时需注意ID一致、JS引入顺序及动态内容的手动控制。