order-类生效需同时满足三个前提：.row必须存在且display为flex、仅对.row直接子元素（.col-*）有效、同级列须全部显式设置order值；响应式order-{bp}-{n}仅在对应断点及以上生效，低断点不继承。
直接用 order- 类，别碰 pull/push —— bootstrap 4+ 已彻底废弃它们，写了也不生效。
为什么 order- 没反应？三个硬性前提必须同时满足
它不是“加了就排”，而是 Flex 排序，依赖底层渲染逻辑：
-
.row必须存在且未被覆盖：检查 computed style 中display是否为flex；删掉自定义 CSS 里可能重置它的display: block或display: grid -
order-只对.row的**直接子元素**（即.col-*）生效；给.col-6 > div加order-md-1是无效的 - 所有同级列都得显式设
order-：如果只给 A 列加order-md-1，B/C 列没设，它们默认order: 0，会插在 A 前面——这不是 bug，是 Flex 的相对排序规则
order- 响应式写法怎么配断点才不翻车
它不像 .col- 是“向上兼容”，而是“仅在该断点及以上生效”，低断点不继承。常见误判：
-
order-md-2在手机（ - 想实现「手机 A→B、平板 B→A、桌面 A→B」，就得写全：
order-xs-1 order-sm-2 order-md-1，不能只写中间一个 - 数值建议控制在
-5到5之间：避免和order-first（order: -1）和order-last（order: 9999）冲突，也方便后期维护
移动端优先时，别只靠 order- 翻转上下顺序
纯 order- 在 flex-direction: row 下只能调左右，在竖排堆叠（flex-column）场景下逻辑易错乱。更稳的做法是容器级控制：
- 小屏用
d-flex flex-column-reverse让整行倒序，再配合order-微调（如图片在上、文字在下） - 桌面切回水平布局：加
flex-md-row，flex-column-reverse自动失效，无需额外重置order - 注意：
flex-column-reverse下margin-bottom实际变成“上边距”，调试时看 computed margin 而非类名
最常被忽略的一点：order 只改视觉顺序，不影响 DOM 结构、tab 键导航流或屏幕阅读器读取顺序。SEO 和可访问性关键内容，必须靠 HTML 本身的位置保证，不能指望 CSS “救场”。
