Bootstrap 3 的 push/pull 类仅支持同一行内两列互换，因其基于 float 布局，通过 left/right 偏移实现视觉挪位，要求两列数值之和为12，且最大偏移为11；不支持三列重排，亦不兼容 Bootstrap 4+ 的 flex order 机制。
Bootstrap 3 的 push 和 pull 类只能交换同一行内、总宽为 12 的两列顺序，不支持三列及以上重排，也不兼容 Bootstrap 4+。
为什么 col-md-push-* 和 col-md-pull-* 只能换两列位置
Bootstrap 3 网格依赖 float: left 实现布局，push 和 pull 本质是通过 left 或 right 的 CSS 偏移强行“视觉挪位”，而非改变 DOM 顺序或 flex 排序。因此：
- 必须在同一
<div class="row"> 内操作，跨行无效 <li>两列的 <code>col-*-*数值之和必须等于 12（例如col-md-8+col-md-4），否则偏移后会错位甚至重叠 - 若写
col-md-push-4但该列本身占 5 列，实际向右移动 4 列后，剩余空间不足，右侧内容会被挤出视口或覆盖 - 没有
col-md-push-12这种写法——最大有效值是 11，因为列宽至少为 1 -
offset（如col-md-offset-3）用margin-left推动整列及其后续所有元素，安全但死板；它不会重叠，超限会自动换行 -
push/pull用float+left/right，只动当前列，其他列完全不受影响——这既是灵活性来源，也是坑的起点 - 典型翻车场景：
col-md-6 col-md-push-6把一列推到最右，但若同行还有另一列没设pull，它仍按原顺序渲染在左，结果两列视觉重叠 - 响应式断点不匹配时（比如只在
md设了push，但sm下没重置），小屏下可能残留错位 - ✅ 适合：PC 端侧边栏与主内容互换（
main在 HTML 后但需视觉前置，aside在 HTML 前但需视觉后置），且二者加起来刚好 12 列 - ✅ 适合：移动端保持上下顺序（如图在上、文在下），桌面端改为左右并排并交换左右位置
- ❌ 不适合：一行三列（如
col-md-4×3）想调成 B-A-C 或 C-B-A——Bootstrap 3 原生不支持，硬套push/pull必然错行或溢出 - ❌ 不适合：需要语义化顺序（如 SEO、可访问性）与视觉顺序一致的场景——
push/pull只改样式，DOM 顺序不变 - ⚠️ 注意：Bootstrap 4 已废弃
push/pull，改用order（flexbox），升级项目时这些类会直接失效
push/pull 和 offset 的关键区别在哪
表面都是“让列挪位置”，但底层机制和副作用完全不同：
在真实项目中哪些场景还能用，哪些该立刻放弃
不是不能用，而是得清楚边界：
真正容易被忽略的是：哪怕你只在 lg 断点用了 col-lg-push-3，也得同步检查 md 和 sm 下是否需要 col-md-pull-0 或类似重置——否则小屏回退时偏移量残留，列就飘了。
