Django模板的加深

网站模板的设计,一般的,都有一些通用的设计,有导航、底部、统计等相关代码:nav.html、bottom.html、tongji.html

在我前面Django工程的基础上建立一个base.html包含这些通用文件(include):

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>{% block title %} 欢迎光临基本页面{% endblock %}</title>
 6 </head>
 7 <body>
 8     {% block content%}
 9         这里是默认内容,所有继承自这个模板的,如果不覆盖就显示这里的默认内容
10     {% endblock %}
11     {% include 'nav.html' %}
12     {% include 'bottom.html' %}
13     {% include 'tongji.html' %}
14 </body>
15 </html>

新建一个home.html文件:

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5 </head>
 6 <body>
 7     演示
 8     {% extends 'base.html' %}
 9     {% block title %}
10         欢迎光临首页
11     {% endblock %}
12     {% block content %}
13         这个是首页内容,可以覆盖基html的内容
14     {% endblock %}
15 </body>
16 </html>

访问:http://127.0.0.1:8000/home/,结果显示:

注:block块中的内容,如果在首页中没有相关的代码则继承base中的block块的内容;如果有则进行覆盖,体现出网页设计的灵活性。
block extends include三者的差别跟用法
一、定义基础模板,在html内容中定义多个block块,block由子模板引用同名block块,来决定是否替换这些部分
{% block title %}一些内容,这里可不填{% endblock %}
{% block content %}一些内容,这里可不填{% endblock %}
{% block footer %}一些内容,这里可不填{% endblock %}
这里 title content footer 不是变量,名字自定义
block一般定义在base.html中 block是可以在那些继承base的html中添加内容的区
二、子模板的引用方式
{% extends "base.html" %}
{% block title %}The current time{% endblock %}
{% block content %}<p>It is now {{ current_date }}.</p>{% endblock %}
第一句是固定的格式,必须为模板中的第一个模板标记
extends的参数一般为字符串,也可为变量
可带路径,相对路径,以 TEMPLATE_DIRS 的模板目录 为基准
子模板决定替换的block块,无须关注其它部分,没有定义的块即不替换,直接使用父模板的block块
三、引用上级代码块在其基础上进行一些修改 {{ block.super }}
{% block footer %}
{{ block.super }}
AAAAA
{% endblock %}

 

posted @ 2017-11-06 11:27  今夜无风  阅读(191)  评论(0编辑  收藏  举报