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 %}