CSS如何在Bootstrap容器内实现全屏背景_利用vh单位设置高度

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，而在背景渲染逻辑。 幻导航网 发现优质实用网站,开启网络探索之旅！