使用{% extends "base.html" %}导致Django忽略子模板代码的问题

问题出在你对Django模板继承的逻辑理解有误：当使用{% extends "base.html" %}时，Django会完全采用base.html的页面结构，子模板中所有不在{% block %}标签内的内容（包括顶级的<html>、<body>等标签）都会被直接忽略，只有填充到对应block里的代码才会被渲染。

第一步：修改base.html，定义可填充的区块 #

首先要在base.html里提前定义好允许子模板替换的block，比如页眉、页脚之外的内容区块，以及头部可自定义的区域：

<!DOCTYPE html>
<html>
<head>
    <!-- 子页面可自定义的头部内容区 -->
    {% block head %}{% endblock %}
</head>
<body>
    <!-- 统一页眉 -->
    <header>网站统一页眉</header>

    <!-- 子页面内容插入位置 -->
    {% block content %}{% endblock %}

    <!-- 统一页脚 -->
    <footer>网站统一页脚</footer>
</body>
</html>

第二步：修改frontpage.html，填充区块内容 #

子模板只需要保留extends声明，然后把你的内容放到对应block里即可，不需要重复写完整的HTML结构：

{% extends "base.html" %}

<!-- 可选：如果子页面需要自定义头部内容，比如添加专属CSS -->
{% block head %}
    <style>
        p { color: #333; }
    </style>
{% endblock %}

<!-- 把页面内容放到content区块中 -->
{% block content %}
    <p>Example</p>
    <p>Example</p>
    <p>Example</p>
    <p>Example</p>
{% endblock %}

关键注意点 #

• {% extends %}必须是子模板的第一行代码，前面不能有任何空格或其他字符，否则继承会失效。
• 父模板中的block可以设置默认内容，比如{% block content %}默认内容{% endblock %}，子模板如果不重写这个block，就会显示默认内容；如果重写，就会覆盖默认值。

内容的提问来源于stack exchange，提问作者Karl Green