模板导入与继承技巧-优快云博客

1 模版导入

1.写一个模版

<div style="height: 100px; width: 100%; background-color: blueviolet">
    <p>这是头部!</p>
</div>

2.在模板中:{% include '模板的名字'%}

<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>test</title>
    {% load static %}
{#    <link rel="stylesheet" href={% static 'css/test_1.css' %}>#}
    <link rel="stylesheet" href="{% get_static_prefix %}css/test_1.css">
</head>
<body>
<h1>不知道要写一些什么东西</h1>
{% include 'head.html' %}
{% block hezi1 %}
    母版盒子一
{% endblock hezi1 %}
<div class="hezi2">
    {% block hezi2 %}
        母版盒子二
    {% endblock hezi2 %}
    {{ price }}
{{ l }}
</div>


</body>
</html>

2 模版继承

1 写一个母版,留一个可扩展的区域(盒子),可以留多个盒子(留的越多,可扩展性越高)

{%block 名字%}
可以写内容
{%endblock 名字%}

<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>test</title>
    {% load static %}
</head>
<body>
<h1>不知道要写一些什么东西</h1>
{% include 'head.html' %}
{% block hezi1 %}
    母版盒子一
{% endblock hezi1 %}
<div class="hezi2">
    {% block hezi2 %}
        母版盒子二
    {% endblock hezi2 %}
    {{ price }}
{{ l }}
</div>


</body>
</html>

2 在子模板中使用:

{%block 名字%}
可以写内容
{%endblock 名字%}

//得到母版中的所有内容
{% extends 'muban.html' %}

//重写模板的内容
{% block hezi2 %}
    <p>这是第二个盒子</p>
    //获得模版block中的内容
    {{ block.super }}
{% endblock hezi2 %}

{% block hezi1 %}
    <p>这是第一个盒子</p>
{% endblock hezi1 %}

注:得到母版内容中的所有内容