使用环境同前django文章。


启动django的web服务：

]#cd/root/py3/django-test1/test4]#pythonmanage.pyrunserver192.168.255.70:8000

一级html模板为base.html；

二级html模板为base_user.html，bae_user.html继承自base.html；

三级html模板为user1.html和user2.html都继承自base_user.html。


分别编写html模板文件：

一级html模板：

]#cd/root/py3/django-test1/test4/]#vimtemplates/bookshop/base.html<!DOCTYPEhtml><html><head><title>Title</title>{%blockhead%}{%endblock%}</head><body><h2>logo</h2><hr>{%blockcontent1%}<h2>父模板--继承</h2>{%endblock%}<hr><h2>contact</h2></body></html>

二级html模板：

]#vimtemplates/bookshop/base_user.html{%extends'bookshop/base.html'%}{%blockcontent1%}<tableborder="1"><tr><tdheight="300">用户导航</td><td>{%blockuser_content%}{%endblock%}</td></tr></table>{%endblockcontent1%}

三级html模板：

user1.html：

]#vimtemplates/bookshop/user1.html{%extends'bookshop/base_user.html'%}{%blockhead%}<script>alert('hellopython-django')</script>{%endblockhead%}{%blockuser_content%}<h2>用户中心1</h2>{%endblockuser_content%}

user2.html：

]#vimtemplates/bookshop/user2.html{%extends'bookshop/base_user.html'%}{%blockuser_content%}<h2>用户中心2</h2>{%endblockuser_content%}

注意：要想在页面显示内容，就必须写在{%block%}标签内，才有效，其它地方都不会显示在页面上。


编写视图函数：

]#vimbookshop/views.pyfromdjango.shortcutsimportrenderfrom.modelsimport*...defindex(request):#list=HeroInfo.objects.all()list=HeroInfo.objects.filter(isDelete=False)context={'list1':list}returnrender(request,'bookshop/index.html',context)defshow(request,id):context={'id':id}returnrender(request,'bookshop/show.html',context)defindex2(request):returnrender(request,'bookshop/index2.html')defuser1(request):context={'username':'python-django'}returnrender(request,'bookshop/user1.html',context)defuser2(request):returnrender(request,'bookshop/user2.html')

配置应用的url路由：

]#vimbookshop/urls.pyfromdjango.conf.urlsimporturlfrom.importviewsurlpatterns=[url(r'^$',views.index,name='index'),url(r'^(\d+)$',views.show,name='show'),url(r'^(\d+)/(\d+)$',views.show,name='show'),url(r'^index2$',views.index2,name='index2'),url(r'^user1',views.user1,name='user1'),url(r'^user2',views.user2,name='user2'),]

浏览器访问：http://192.168.255.70:8000/user1

点击javascript的弹框，继续显示页面：


访问浏览器：http://192.168.255.70:8000/user2

此例三层模板继承，说明，模板可以跨层级继承且可传递变量。