1,关于父模板继承
观察需要抽离的基础html内容，放到一个文件内，这个文件比如说就叫做 base.html
不需要更改的内容，所有文件都有的内容不要更改，直接原封放上
需要更改的内容通过
{% block 预留块名 %} 内容{% endblock 预留块名 %}
父模板文件如下 base.html
{#首页 注册 登录#}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
{% load staticfiles %}
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
{#网页标题内容块#}
<title>{% block title %}{% endblock title %}</title>
<link rel="stylesheet" type="text/css" href="{% static 'css/reset.css' %}">
<link rel="stylesheet" type="text/css" href="{% static 'css/main.css' %}">
{# 网页顶部引入预留文件块 子模板自己在块内填上需要的内容即可#}
{% block topfiles %} {% endblock topfiles %}
</head>
<body>
{#顶部欢迎信息块 大部分都有 如果不需要 子模板重写时里面不放内容即可清除掉#}
{% block header_con %}
<div class="header_con">
<div class="header">
<div class="welcome fl">欢迎来到天天生鲜!</div>
</div>
</div>
{% endblock header_con %}
{#网页主体内容块 子模板自己定制内容即可#}
{% block body %}
{% endblock body %}
{#公共的内容 子模板无需更改 直接继承#}
<div class="footer">
<div class="foot_link">
<a href="#">关于我们</a>
<span>|</span>
<a href="#">联系我们</a>
<span>|</span>
<a href="#">招聘人才</a>
<span>|</span>
<a href="#">友情链接</a>
</div>
<p>CopyRight © 2016 北京天天生鲜信息技术有限公司 All Rights Reserved</p>
<p>电话：010-****888 京ICP备*******8号</p>
</div>
</body>
</html>
子模板文件如下 child.html
<!--表示要继承自哪里-->
{% extends 'base.html' %}
{% block title %}
子模板的标题
{% endblock %}
{#如果需要清除父模板的内容#}
{% block header_con %}{% endblock header_con %}
{#如果还想要父模板的内容 还想加入自己的内容 调用下{{ block.super }}#}
{% block first_block%}
{{ block.super }}
<div>这是子模板自定义的块</div>
{% endblock first_block%}
网友评论