应为body添加padding-bottom预留悬浮条空间，使footer保持文档流位置；或改用flex布局将主体设为flex:1，让按钮自然位于内容末端而不遮挡版权信息。
footer 版权信息被 fixed 悬浮条遮住怎么办
直接给 footer 加 position: fixed; bottom: 0，几乎必然导致它盖住页面末尾内容——尤其是当页面高度超过一屏时。这不是 CSS 写错了，而是语义和布局逻辑冲突了：footer 的本意是文档结尾，而 position: fixed 让它脱离文档流、悬浮在视口层，自然会压住滚动中刚进入视口底部的段落或按钮。
fixed 悬浮条和版权 footer 必须分属不同层级
真正的“底部固定悬浮条”（比如移动端操作栏、快速回复按钮）和“版权信息”不是同一个东西，不能共用一个 footer 元素，也不能都设 fixed。它们的定位目标完全不同：
- 悬浮条：始终贴视口底边，不随滚动消失 → 适合
position: fixed - 版权信息：始终是页面逻辑终点，短页时沉底、长页时紧贴内容末尾 → 必须留在文档流中
常见错误是把两者塞进同一个 <footer>，再统一加 fixed，结果版权文字在长页里直接消失，打印时也找不到。
如何让 fixed 悬浮条不遮 footer 版权信息
关键不是调 z-index，而是为文档流预留空间。只要 body 或主容器有足够 padding-bottom，footer 就能自然停在悬浮条上方，不被覆盖：
立即学习“前端免费学习笔记（深入）”；
- 给
body加padding-bottom: 56px（值 = 悬浮条实际高度） - 确保
footer是body的最后一个子元素，且不设position、height或margin-top: auto - 悬浮条自身必须写全：
position: fixed; bottom: 0; left: 0; right: 0; height: 56px - 避免在悬浮条内放
<input>或<textarea>—— iOS 键盘弹出后，fixed元素常错位或消失
更稳妥的替代方案：用 flex 布局替代 fixed
如果所谓“悬浮条”其实只是导航入口、订阅按钮这类非强交互组件，且不需要严格贴视口底（比如允许随内容滚动到底部才出现），那根本不用 fixed。用 flex 布局把主体撑满、把按钮“推”到内容末端，反而更稳定：
-
body设display: flex; flex-direction: column; min-height: 100vh -
main设flex: 1，吃掉所有剩余空间 - 把按钮放在
main外、footer前，例如：<div class="cta-bar">立即订阅</div> -
footer保持默认流位置，不加任何定位
这种写法绕开了 fixed 在 iOS Safari 中的键盘错位、地址栏收放跳变、打印丢失等问题，而且语义清晰——按钮是内容的一部分，不是悬浮层。
