本文详解如何通过 django 模板继承机制，在 base.html 中统一定义页脚区域，并确保其始终位于内容下方（非悬停覆盖），避免 position: absolute 导致的遮挡与滚动错位问题。

本文详解如何通过 django 模板继承机制，在 base.html 中统一定义页脚区域，并确保其始终位于内容下方（非悬停覆盖），避免 position: absolute 导致的遮挡与滚动错位问题。

在 Django 项目中，模板继承是实现 UI 一致性和代码复用的核心机制。当你希望网站所有页面共享相同的页脚（如版权信息、备案号、友情链接等），不应将页脚硬编码在每个子模板中，更不应依赖 position: absolute; bottom: 0 实现“底部固定”——后者实际是视口底部定位，会导致页脚悬浮覆盖正文、随滚动上移，违背语义化布局原则。

正确的做法是：在基础模板（base.html）中结构化定义页脚为一个可继承、可定制的 {% block %} 区域，并将其置于文档流末尾。这样，无论子模板填充多少内容，页脚都会自然跟随在全部内容之后渲染，真正实现“内容撑开、页脚置底”。

✅ 推荐实现方式（语义清晰 + 布局可靠）

首先，在 templates/base.html 中定义标准 HTML 结构：

Django Unfold

提供使用 django-unfold (v0.56+) 构建高级 Django 管理界面的专业指导。当用户提及 django-unfold、unfold admin 等内容时使用此技能。

下载

    <meta charset="UTF-8"><title>{% block title %}我的网站{% endblock %}</title>
    {% block extra_head %}{% endblock %}


    {% block header %}
        <header class="site-header"><h1>我的在线教育平台</h1>
            <!-- 公共导航栏 -->
        </header>
    {% endblock header %}

    <main class="site-main">
        {% block content %}
            <p>此处将被子模板的内容替换。</p>
        {% endblock content %}
    </main>

    {% block footer %}
        <footer class="site-footer"><div class="test_footer">
                © 2026 在线教育平台 | 蜀ICP备12345678号
            </div>
        </footer>
    {% endblock footer %}

? 关键点：

• 页脚
  直接放在

  之后、