Bootstrap 5 中 modal-title 居中直接加 text-center 类即可，必须作用于 自身，而非 .modal-header；类名不可误写为 text-centering 等非官方命名。
Bootstrap 5 中 modal-title 居中要用 text-center，不是 text-centering
直接给 <h5 class="modal-title"></h5> 加 text-center 就行，别写错类名（比如 text-centering 或 center-text），Bootstrap 官方没有这类命名。
常见错误是以为标题居中要动 .modal-dialog 或写 JS 计算，其实它只是个普通块级元素，text-align 完全适用。
-
text-center必须加在modal-title元素自身上，加在.modal-header上无效（因为modal-header默认是 flex 容器，text-align不影响其子项对齐） - 如果用了自定义字体或设置了
font-weight: bold导致宽度撑开，仍能居中——text-center作用于内容流，不依赖宽度 - 响应式需求？用
text-sm-center text-md-start这类组合，小屏居中、中屏左对齐 - 别用
style="text-align: center"写内联样式，会覆盖断点类，导致响应式失效
为什么给 .modal-header 加 d-flex justify-content-center 不推荐
虽然加了 d-flex justify-content-center 看似也能把标题推到中间，但它会破坏原生 .modal-header 的默认 flex 布局逻辑：原生结构里 .modal-title 和 .btn-close 是并排的，强制 justify-content-center 会让关闭按钮也跟着居中，甚至被挤出可视区。
更隐蔽的问题是：当模态框内容窄、标题短时，这种“整行居中”会让标题左右留白不均，视觉上反而偏移。
- 原生
.modal-header已设display: flex+justify-content: space-between，这是为容纳标题+关闭按钮设计的 - 若硬要 flex 控制，应只作用于标题容器内部（比如包一层
<div class="w-100 text-center"><h5 class="modal-title">...</h5></div>），但纯属绕路 - 移动端 Safari 下，flex 居中可能因视口缩放触发重绘抖动，
text-center无此风险
ModalTitleCenter 类不存在，别搜这个字符串
网上有些文章或旧项目里出现 ModalTitleCenter，其实是自定义 CSS 类名，不是 Bootstrap 内置。Bootstrap 官方从未提供该类，也不在任何版本文档中出现过。
如果你在代码里看到它，大概率是团队自己写的，类似：
.ModalTitleCenter {
text-align: center;
}
这种写法没必要——直接用 text-center 更轻量、可维护、兼容未来升级。
- 自定义类名容易和组件库冲突（比如某些 UI 库也叫
ModalTitleCenter） - 它无法响应式（除非你额外写
@media），而text-sm-center天然支持 - 搜索代码时搜
text-center能命中所有地方，搜ModalTitleCenter只能找特定文件
标题文字太长换行后居中失效？检查是否漏了 white-space
默认情况下 text-center 对多行文本依然有效，但如果标题加了 white-space: nowrap 或父容器设了 overflow: hidden，会导致文字被截断或单行溢出，看起来像“没居中”。
- 确认没在
.modal-title或其父级上设置white-space: nowrap - 如果标题含图标（如
<i class="bi bi-exclamation"></i> 提示），确保图标没用float或position: absolute破坏行内流 - 极少数情况：用了
display: inline-block包裹标题，又没设text-align: center到外层，此时需在外层加text-center
真正麻烦的是动态插入标题后 DOM 未重绘——比如用 JS 设置 innerHTML 后没触发 reflow，但这种情况极少，优先排查 CSS 层面。
