本文详解如何通过 Django 模板继承机制统一管理页脚，避免 position: absolute 导致的覆盖与滚动错位问题，实现内容流式自然置底、响应式兼容的页脚布局。
本文详解如何通过 django 模板继承机制统一管理页脚，避免 `position: absolute` 导致的覆盖与滚动错位问题，实现内容流式自然置底、响应式兼容的页脚布局。
在 Django 项目中，模板继承是提升开发效率与维护性的核心实践。当你希望所有页面共享一致的页脚（如版权信息、联系方式、备案号等），最规范的做法不是在每个子模板中重复粘贴 HTML，也不是依赖易出错的 CSS 定位（如 position: absolute; bottom: 0），而是利用 {% block %} 预留语义化区域，并在基础模板（base.html）中将页脚置于文档流末端——让其自然跟随内容高度，真正“位于页面最底部”，而非“粘在视口底部”。
✅ 正确做法：结构化继承 + 文档流布局
首先，在项目模板根目录（如 templates/）下创建基础模板 base.html：
Django Unfold
下载
提供使用 django-unfold (v0.56+) 构建高级 Django 管理界面的专业指导。当用户提及 django-unfold、unfold admin 等内容时使用此技能。
<!-- templates/base.html -->
<meta charset="UTF-8"><title>{% block title %}我的网站{% endblock %}</title>
{% block extra_css %}{% endblock %}
<!-- 顶部导航区（可选） -->
{% block header %}
<header class="site-header"><h1>My EduSite</h1>
</header>
{% endblock header %}
<!-- 主体内容区（必填） -->
<main class="main-content">
{% block content %}
<p>此处为默认主页内容，子模板需重写此 block。</p>
{% endblock content %}
</main><!-- 页脚区：关键！放在 </main> 之后、</body> 之前 --><footer class="site-footer">
{% block footer %}
<div class="test_footer">
© {{ now|date:"Y" }} My Website. 保留所有权利。
<br><small>技术支持：Django {{ version }}</small>
</div>
{% endblock footer %}
</footer>
{% block extra_js %}{% endblock %}
? 关键设计原则：
