position: fixed + bottom: 0 未生效，主因是祖先元素触发新包含块（如 overflow: hidden、transform）；footer 不适用 sticky，因其需在滚动中进入视口才能粘住；可靠方案为 fixed 配合 body padding-bottom 预留高度，或用 flex 布局实现内容少时沉底、多时滚动。
bottom: 0 和 position: fixed 为什么没生效？
常见现象是写了 position: fixed + bottom: 0，但元素没贴底，甚至完全看不见。原因通常是：父容器设置了 overflow: hidden 或 transform、filter 等属性，触发了新的层叠上下文或包含块，导致 fixed 元素相对于该父容器定位，而非视口。
实操建议：
- 检查最近的有
transform、filter、will-change、overflow: hidden的祖先元素，临时移除它们验证是否恢复 - 确保没有其他 CSS（如
top: 0）与bottom: 0冲突 - fixed 元素默认脱离文档流，需手动设
width: 100%才撑满底部宽度
position: sticky 在 footer 上为何完全不响应？
position: sticky 要求元素必须在**正常流中滚动到临界点才会“粘住”**，而 footer 通常位于页面最底部，根本没机会滚动到它——它一上来就已在视口底部下方，所以永远不会触发 sticky 行为。
使用场景有限制：
立即学习“前端免费学习笔记（深入）”；
- 只适用于**父容器高度超出视口、且目标元素位于父容器中上部**的情况（比如表格标题栏、侧边导航）
- footer 不适合用 sticky 实现“底部固定”，这不是它的设计用途
- 若强行套用，需把 footer 塞进一个高容器里并设置
overflow-y: scroll，但这违背语义和体验
真正可靠的底部固定方案：fixed + 高度预留
要让底部始终可见且不遮挡内容，不能只靠 position: fixed，还必须防止正文被盖住。核心是：**fixed 元素不占空间，所以得给 body 或主容器留出等高的内边距/外边距**。
