左下角 Toast 必须用 position-fixed bottom-0 start-0 组合定位，缺一不可；需外层容器带 aria-live="polite" 和 aria-atomic="true"；动态插入须先挂载 DOM 再初始化实例。
Bootstrap 5 中左下角 Toast 必须用 position-fixed + bottom-0 + start-0
直接写 fixed-bottom 或只加 bottom-0 不会生效——fixed-bottom 是 position-fixed 的别名，但没指定水平对齐；bottom-0 单独用时默认 left=0，但受 RTL 影响可能错位。真正起作用的是三者组合：position-fixed bottom-0 start-0。
常见错误现象：Toast 贴着左下角被截断、文字看不见、关闭按钮点不中。
- 必须显式声明
position-fixed（不能省略） -
bottom-0控制垂直对齐到视口底部 -
start-0控制水平对齐到“起始边”（LTR 下是 left，RTL 下自动转 right） - 加
ms-3 mb-3或p-3防止贴边溢出，尤其在移动端
多个左下角 Toast 堆叠必须用统一外层容器包裹
如果把多个 .toast 元素平铺在 DOM 里，它们的 z-index 默认相同，后插入的反而压在底层，点击关闭按钮失效。
正确结构只有一个外层容器，且必须带关键属性：
-
aria-live="polite"和aria-atomic="true"—— 不只是可访问性要求，也影响渲染顺序和堆叠逻辑 -
position-fixed bottom-0 start-0—— 容器自身定位，所有子 toast 以此为基准 - 不要嵌套进
.container、.row或任何有overflow: hidden的父级，否则会被裁剪
示例结构：
<div aria-live="polite" aria-atomic="true" class="position-fixed bottom-0 start-0 p-3"> <div class="toast fade">…</div> <div class="toast fade">…</div> </div>
动态插入左下角 Toast 必须先挂载 DOM 再初始化实例
用 JS 创建 .toast 元素后直接 new bootstrap.Toast(el)，大概率静默失败——因为元素还没插入 DOM，querySelector 找不到它，控制台也不报错。
正确顺序：
- 先用
parentElement.appendChild(toastEl)把元素挂到外层容器里 - 再用
document.querySelector('.toast')（或更精确的选择器）拿到刚插入的节点 - 最后调用
new bootstrap.Toast(toastEl).show() - 频繁弹出时记得调用
toast.dispose()，否则有内存泄漏风险
BootstrapBlazor 用户注意：Placement.LeftBottom 不是 CSS 类
如果你用的是 BootstrapBlazor（不是原生 Bootstrap），位置由 Placement 枚举控制，写 class="bottom-0 start-0" 完全无效。
左下角对应枚举值是 Placement.BottomStart（不是 LeftBottom，该枚举不存在）。
- 全局设置：
options.ToastPlacement = Placement.BottomStart; - 单个 toast：
Placement = Placement.BottomStart - 写成
"bottom-start"字符串或bottom-start类名，都不会生效
真正容易被忽略的是：外层容器的 aria-live 和 position-fixed 必须同时存在，缺一不可；动态插入时 DOM 挂载和实例化顺序不能颠倒。
