vh在Bootstrap中“不够高”是因为.container有内边距和最大宽度限制父级存在默认margin或滚动条占位应优先对section等外层标签用min-height: 100vh并重置html、body样式避免gap与h-100冲突。为什么vh在Bootstrap容器里经常“不够高”因为Bootstrap的.container或.container-fluid本身有内边距、最大宽度限制且父级比如body可能有默认margin或滚动条占位——100vh算的是视口高度但元素一旦被嵌套在有padding/margin/overflow约束的容器里视觉上就“顶不到头”。更常见的是你写了height: 100vh结果背景只铺满内容区顶部留白、底部截断。min-height: 100vh比height: 100vh更稳妥用height: 100vh会强制拉伸内容少时留白内容多时溢出而min-height: 100vh让容器至少撑满视口内容多了就自然延伸——这才是全屏背景的真实需求。对Bootstrap中的.row或自定义section加min-height: 100vh不是对.container本身如果背景需要覆盖整个视口含滚动条位置记得在html和body上重置 html, body { margin: 0; padding: 0; height: 100%; }移动端Safari对vh有bug地址栏收放导致高度跳变可配合min-height: 100%降级兜底背景图不随容器缩放检查background-size和background-attachment即使高度对了背景图常出现拉伸、居中偏移或固定不动——问题不在vh而在背景渲染逻辑。 幻导航网 发现优质实用网站,开启网络探索之旅