本文详解 bootstrap 5.3 中 modal 无法触发显示、且隐藏时仍占用布局空间的常见原因，重点指出 data-toggle/data-dismiss 属性已弃用，必须替换为 data-bs-toggle/data-bs-dismiss，并提供完整可运行示例与关键注意事项。
在使用 Bootstrap 构建登录/注册流程时，Modal 是高频组件。但许多开发者（尤其是首次接触 Bootstrap 5.3 的用户）会遇到两个典型问题：点击按钮无响应，Modal 完全不弹出；以及 Modal 即使未显示，也会推挤页面其他元素，造成布局塌陷或错位。根本原因在于 Bootstrap 5 起已全面重构 JavaScript API，废弃了旧版 v4 的 data-toggle 和 data-dismiss 属性，统一升级为带 bs- 命名空间的 data-bs-toggle 与 data-bs-dismiss。
✅ 正确的属性写法（Bootstrap 5.3+）
请将你的触发按钮和关闭按钮中的属性严格更新如下：
