模板三（继承标签）


Django_模板之继承（extends）

    作用：使用模板继承可以减少Django模板配置中的代码冗余
    语法：
        为父文件内容加入盒子
        {% block content %}
            放要修改的内容
        {% endblock %}

        子文件内容
        {% extends "父模板文件名"}  #继承父文件的内容，子文件除了盒子以外的其余内容和父文件的一样
        {% load static %}  #引入其他模板的内容

        {% block 块名 %}    #块名是自己起的
            修改的内容或增加的内容

            {% include "其他模板文件名" %}
        {% endblock %}

    说明：
        块越多越好
        如果在模板中使用{% extends 要继承的文件名 %}，必须在第一行
        如果需要访问父模板中的块的内容，使用{{block.super}}，然后就可以在上级代码的基础上添加内容，而不是全部重载。
        多个模板之间使用相同的代码，可以将其放置到父模板的某个{% block %}中
        不允许在同一个模板中定义多个同名的{% block %}

实例：

父模板内容（.html文件）

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <script src="jquery-3.1.1.js"></script>
    <title>Title</title>

    #盒子
    {% block styles %}

    {% endblock %}

    <style>
        * {
            margin: 0;
            padding: 0
        }
        .nav{
            line-height: 40px;
             100%;
            font-style:italic;">#2459a2;
            color: white;
            font-size: 20px;
            text-align: center;
        }

        .left{
             20%;
            min-height: 600px;
            overflow: auto;
            

        }

        .manage{
            text-align: center;
            padding: 20px 0;
            margin: 20px 0;
            font-size: 18px;

        }

        .left,.content{
            float: left;
        }
        .content{

             70%;
            min-height: 600px;
        }
        a{
            text-decoration: none;
        }
        h1,h2{
            text-align: center;
        }
    </style>
</head>
<body>
<div class="outer">
    <div class="nav">标题</div>

    <div class="left">
         <div class="student manage"><a href="/student/">学生管理</a></div>
    </div>
    <div class="content">
        #盒子
        {% block  content%}
             <h1>WELCOME TO LOGIN</h1>
        {% endblock %}
    </div>
</div>
</body>
</html>

子模板内容(.html文件)
{% extends "base.html" %}
{% load static  %}

{% block content %}
    {{ block.super }}
    {% for stu in student %}
        <h2>学生{{ stu }}</h2>
    {% endfor %}
    {% include "test.html" %}
{% endblock %}

其他模板内容（test.html)
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h1 style="color: cadetblue">这是其他模板的内容</h1>
</body>
</html>