bootstrap栅格在移动端“失效”主因是viewport缺失或错误、row与col结构嵌套不规范、断点类未写全；必须确保viewport标签正确置于head中，row直接包裹col，且至少声明col-12等基础断点。
Bootstrap 栅格在移动端“失效”，90% 不是框架问题，而是视口没管住、结构没嵌对、断点没写全——它压根就没被浏览器当成移动端来渲染。
viewport 缺失或写错，所有断点类都形同虚设
Bootstrap 的 col-sm-6、col-md-4 这些类，完全依赖浏览器识别的视口宽度。没 <meta name="viewport">，iOS Safari 和多数 Android WebView 就按 980px 渲染，sm（576px）及以上断点全不触发。
- 必须写在
里，不能丢进 - 拼写必须是
name="viewport"，不是viewpoint或viewport-meta - 内容必须含
width=device-width, initial-scale=1；加maximum-scale=1反而可能降级到兼容模式 - 真机调试时看
window.innerWidth：如果显示 980 或 1024，基本就是 viewport 没生效
.row 和 .col- 不是直接父子关系，Flex 布局就断了
Bootstrap 4/5 的 .row 是 display: flex 容器，但它只对**直接子元素**应用 flex-basis 和间距逻辑。中间插个 <form></form>、<div class="card"> 或 <code><section></section>，栅格就彻底“看不见” .col-。
- 错误写法：
<div class="row"><form><div class="col-6"></div></form></div> - 正确写法：
<div class="row"> <div class="col-6"></div> <div class="col-6"></div> </div> - DevTools 里检查
.col-元素的Computed样式：如果flex-basis是auto而不是50%，说明它没被.row管理 - 嵌套时，内层
.row必须加mx-n2（Bootstrap 4）或mx-n3（Bootstrap 5），否则父.col-的 padding 和子.row的 margin 抵消不干净
只写大断点类，小屏下自动退化成单列堆叠
Bootstrap 断点是“覆盖式回退”，不是叠加生效。col-md-6 在手机上不会分两列，它会直接退回到无类名状态（即 col-12）。你以为它“失效”，其实是它根本就没打算在小屏工作。
- 必须显式声明最小断点：
class="col-12 col-md-6 col-lg-4"，确保从手机起就有定义 -
col-6等价于col-xs-6（Bootstrap 4）或默认最小断点（Bootstrap 5），所有尺寸都生效 - Chrome DevTools 切设备后，左上角显示的是真实视口宽度（如 375px、414px），对照 Bootstrap 断点阈值（
xs: 0,sm: 576px,md: 768px）判断是否匹配 - 混用版本类名会失效：Bootstrap 4 的
col-sm-6起始于 576px，Bootstrap 3 是 768px；写错版本，断点就永远不命中
横向滚动条出现，本质是 .row 负边距溢出
.row 默认有 margin-left: -15px / margin-right: -15px，这是为了抵消 .container 或 .col- 的 padding。但一旦 .row 被直接放 、放进 display: flex 父容器、或嵌套在未设 max-width: 100% 的 .col- 里，负边距就变成“拖出屏幕”的源头。
- 用 DevTools 查
.row的盒模型：如果左右边界明显超出视口宽度，就是它干的 - 修复入口不在
.row自身，而在它的父容器——给外层.col-加overflow-hidden（Bootstrap 5 内置）或显式max-width: 100% - 别给
.row加overflow: hidden：它是 flex 容器，加了无效，还可能干扰子项布局 -
gx-类只作用于.row，加在.col-上完全没效果；响应式写法必须显式覆盖，比如gx-0 gx-md-3，否则小屏仍走默认gx-2
真正难缠的点往往藏在嵌套深处：一个漏掉的 mx-n3、一层没设 overflow-hidden 的 .col-、或者 viewport 里多写的 user-scalable=no，都可能让整页栅格在真机上突然“塌方”。调试时优先看视口宽度和盒模型边界，比猜 CSS 优先级更可靠。
