nav-item 或 nav-link 加 text-end 无效，因 navbar 是 flex 布局；右对齐需在 navbar-nav 同级元素用 ms-auto，折叠态改用 text-end，品牌居中需三栏结构配合 flex-grow-1 和 justify-content-center。
直接给 nav-item 或 nav-link 加 text-end 不起作用——因为 navbar 是 flex 布局，文本对齐类只影响块内文字，不改变 flex 项的位置。
用 ms-auto 推动整个导航容器右移
右对齐的本质不是“让文字靠右”，而是让某个 navbar-nav（或它的同级容器）在 flex 主轴上占据剩余空间左侧，从而把内容“挤”到最右。
-
ms-auto必须加在navbar-nav的同级元素上（比如另一个ul或div），不能加在nav-item自身 - 错误写法：
<li class="nav-item ms-auto">Login</li>→ margin 对 inline 元素无效 - 正确结构示例：
<div class="collapse navbar-collapse" id="navbarNav"> <ul class="navbar-nav"> <li class="nav-item">Home</li> </ul> <ul class="navbar-nav ms-auto"> <li class="nav-item">Login</li> </ul> </div>
小屏折叠后右对齐失效？这是设计使然，得单独处理
ms-auto 在折叠态（navbar-collapse 展开为垂直菜单时）会自动失效，因为 flex-direction 变成 column，margin-left: auto 失去意义。这不是 bug，是响应式逻辑的一部分。
- 移动端想让按钮靠右，改用
text-end包裹单个按钮（如<div class="navbar-text text-end"><button>Login</button></div>） - 如果用了
dropdown，确保dropdown-menu-end加在<ul class="dropdown-menu">上，且dropdown容器本身已用d-flex ms-auto推到右侧 - 别给
navbar-nav加ms-auto：它此时只是 collapse 容器里的一个子项，加了也没用
品牌居中 + 菜单靠右？别用 mx-auto 或 text-center
navbar-brand 默认是 inline 元素，mx-auto 无效；text-center 只影响其内部文字，不改变它在 flex 行中的位置。
- 可靠做法是拆成三栏：
<div class="navbar-nav me-auto"></div>（左占位）、<div class="navbar-brand flex-grow-1 d-flex justify-content-center">Logo</div>（中撑满并居中）、<ul class="navbar-nav ms-auto"></ul>（右菜单） - 注意
order类（如order-1/order-2）可确保视觉顺序，哪怕 DOM 顺序调整也不乱 - offcanvas 模式下，
flex-grow-1和justify-content-center在navbar-brand上会失效，必须同步给offcanvas-body加justify-content-center
最容易被忽略的是容器层级：navbar 的 flex 流分三层——品牌区、折叠容器（navbar-collapse）、独立右对齐区。混用这三层，或者试图用文本对齐类干预 flex 项位置，都会导致行为不可预测。
