必须显式添加 d-md-flex（或对应断点的 d-flex）才能使 flex-md-row 生效；仅写 flex-column flex-md-row 在中屏下仍为块级流，因 flex-md-row 仅设 flex-direction: row，不开启 flex 上下文，需 d-flex 触发 display: flex。
必须显式加 d-md-flex（或对应断点的 d-*flex）才能让 flex-md-row 这类方向类生效；只写 flex-column flex-md-row，在中屏（sm/md）下大概率还是块级流，不是你想要的“大屏横排”。
为什么 flex-md-row 在大屏没反应
因为 flex-md-row 只设置 flex-direction: row，它不负责开启 Flex 上下文——这个活儿得由 d-md-flex 干。漏掉它，浏览器根本不会把容器当 Flex 容器渲染，所有方向、换行、对齐类全失效。
- 打开开发者工具，检查该元素的 Computed 样式里有没有
display: flex；没有，就是d-*flex类缺失 - 常见错误写法：
class="flex-column flex-md-row"—— 缺d-flex或d-md-flex，整个容器在 md 尺寸下仍是display: block -
d-flex本身无断点，d-sm-flex、d-md-flex才是带断点的“开关”
d-flex flex-column flex-md-row 是最小可行组合
这是实现“小屏竖排、大屏横排”的最简且可靠写法，关键在类名顺序和断点连续性。
-
d-flex：从 xs 起启用 Flex 布局 -
flex-column：默认纵向主轴（xs 尺寸生效） -
flex-md-row：从 768px 起覆盖主轴为横向，且必须后置，否则被flex-column压制 - 别写
flex-column flex-lg-row：sm/md 区间断层，那一段尺寸下子项按文档流堆叠，布局失控
图文上下/左右切换要靠 flex-column-reverse + 断点方向覆盖
比如移动端图片在上、文字在下，桌面端左右并排——不能靠 order 或 JS，用 Flex 方向反转最干净。
- 结构保持语义顺序（先文字后图片），容器加：
class="d-flex flex-column-reverse d-md-flex flex-md-row" - 移动端：
flex-column-reverse让图片视觉上出现在文字上方 - 桌面端：
d-md-flex激活 Flex，flex-md-row生效，自动取消 reverse 效果，恢复源码顺序 - 配合
col-md-6控制宽度，确保两栏等宽并列；小屏下因是 column，自然堆叠
真正容易被忽略的是：Flex 工具类不是独立开关，它们全部依赖容器是否真实进入 Flex 上下文。嵌套结构里，父容器漏一个 d-md-flex，子项再怎么写 flex-md-wrap 都是白搭——computed 样式里看不到 display: flex，就等于没启动。
