文章/答案/技术大牛

发布

问Jinja {%扩展%}
EN

Stack Overflow用户

提问于 2016-04-19 22:43:14

回答 3查看 13.8K关注 0票数 5

好的，我有了第一个超文本标记语言文件(header.html)：

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>M4A</title>
{% load staticfiles %}
<link rel="stylesheet" type="text/css" href="{% static 'css/header.css' %}" />
<link rel="icon" href="../../static/image/logo.png">
</head>
<body class="body" style="background-color:#f9f9f9">
{% block content %}
    <ul>
        <li><a href="/"><img src="../../static/image/logoRect.png" width="25"> </a></li>
        <li><a href="/movies">Movies</a></li>
        <li><a class="left" href="">Search</a></li>
        <li><a class="left" href="/profile/">Profile</a></li>
        <li><a class="left" href="#about">Explore</a></li>
    </ul>
{% endblock %}
</body>
</html>

然后我有了另一个(home.html)：

{% extends "START/header.html" %}

{% block content %}

<p> TEST</p> <!-- for example -->

{% endblock %}

但是当运行第二个HTML文件时，它并没有真正地扩展，它看起来像是替换了另一个HTML文件主体的内容。背景颜色仍然是我的css文件中的颜色，所以我确信它正在读取它。我遗漏了什么？

html

django

jinja2

回答 3

Stack Overflow用户

回答已采纳

发布于 2016-04-19 22:51:33

当您在home.html中使用与在header.html中相同的块标记时，您将替换主体

{% block content %}

如果您不想替换它，则应该使用其他名称。

此外，您还可以使用：

{{ block.super() }}

如果您想扩展块内容数据，请注意这与扩展模板是一个不同的问题。

票数 7

Stack Overflow用户

发布于 2016-04-19 22:54:45

我不清楚你在期待什么。

Jinja documentation about templates非常清楚块的作用：

block标记所做的全部工作就是告诉模板引擎，子模板可以覆盖模板中的那些占位符。

在您的示例中，基本模板(header.html)具有内容块的默认值，即该块中的所有内容。通过在home.html中设置一个值，可以用另一个块覆盖该缺省值。

如果要在导航菜单下添加内容，只需将模板修改为以下内容：

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>M4A</title>
{% load staticfiles %}
<link rel="stylesheet" type="text/css" href="{% static 'css/header.css' %}" />
<link rel="icon" href="../../static/image/logo.png">
</head>
<body class="body" style="background-color:#f9f9f9">
    <ul>
    <li><a href="/"><img src="../../static/image/logoRect.png" width="25"> </a></li>
    <li><a href="/movies">Movies</a></li>
    <li><a class="left" href="">Search</a></li>
    <li><a class="left" href="/profile/">Profile</a></li>
    <li><a class="left" href="#about">Explore</a></li>
</ul>
{% block content %}<p>This will appear if you don't set a block in the inheriting template.</p>{% endblock %}
</body>
</html>

票数 1

Stack Overflow用户

发布于 2016-04-19 23:06:18

    <!DOCTYPE html>
    <html lang="en">

    <head>
    <meta charset="UTF-8">
    <title>M4A</title>
    {% load staticfiles %}
    <link rel="stylesheet" type="text/css" href="{% static 'css/header.css' %}" />
    <link rel="icon" href="../../static/image/logo.png">
    </head>

    {% block content %}
     <body class="body" style="background-color:#f9f9f9">
        <ul>
            <li><a href="/"><img src="../../static/image/logoRect.png" width="25"> </a></li>
            <li><a href="/movies">Movies</a></li>
            <li><a class="left" href="">Search</a></li>
            <li><a class="left" href="/profile/">Profile</a></li>
            <li><a class="left" href="#about">Explore</a></li>
        </ul>
     </body>
    {% endblock %}

    </html>

将正文放入块中，并更改正文背景

{% extends "START/header.html" %}

{% block content %}
<body class="body" style="background-color:#f23d49">
    <p> TEST</p> <!-- for example -->
</body>
{% endblock %}

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/36721724

复制

相似问题

问Jinja {%扩展%}
EN

回答 3

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Jinja {%扩展%}EN

回答 3

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Jinja {%扩展%}
EN