在编程的过程中,我们经常会重复性的写了很多的代码,比如一个页面的框架部分,这样我又多少个页面就得写上多少次,这样既不好维护,也不够高效,所以我们引出了html的模板继承部分。

1、写好一个html文件。

2、下面有个新的html文件需要继承上面这个html。

  直接在这个新的html文件的最顶端,写上下面的内容

  

#这个manger.html就是母版的文件名称,告诉这个html去哪里继承。
{% extends 'manger.html' %}

3、问题来了,我们既然是继承,总不能全部继承吧,我们肯定是需要写一些新的内容在新的html文件中展示,我们只是继承母版中的一部分,比如head之类的。

  比如我们要在html的一个位置更换新的内容。

  1、定义一个继承的块,叫index。

{% block index %}{% endblock %}

  2、继承者在自己的文件中需要更换新的内容,需要这么写。

  注意:只需要在继承的任意位置写上{% block index %}内容区{% endblock  %}

{% block index %}
<div style="height: 45px;line-height: 45px;font-size: 15px;font-weight: bolder">
<span>首页&nbsp;></span>
<span>资产管理</span>
</div>
{% endblock %}

4、问题由来了,如果我的html内容特别多,我看着特别乱,这样我可以把这些内容都写到一个新的html文件里面,然后在我的html文件中直接引用就OK。

例如:我单独写了一个test.html文件。

我想在html中引用直接写入地下的东西就OK了。

{% include "test.html" %}

5、写自己的CSS和JS样式或操作。

  

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<style>
body{
height: 38px;
width: 300px;
}
</style>
{% block css %}{% endblock %}
<body>
<div> </div>
<script src="jquery-x.x.x"></script>
{% block js %}{% endblock %}
</body>
</html>

  这样,我们就可以在自己的html文件中直接写自己的css样式或者js操作。

{% block css %}
<style> </style>
{% endblock %} {% block js %}
<script> </script>
{% endblock %}

Django之html-模板继承的更多相关文章

  1. Django框架之模板继承和静态文件配置

    一.模板继承 目的是:减少代码的冗余 语法: {% block classinfo %} {% endblock %} 具体步骤: 1.创建一个base.html文件,2.把要显示的页面的内容写在这里 ...

  2. Django之前端模板继承

    在使用Django进行web开发时,往往会构造一个基础框架模板即base.html,而后在其子模板中对它所包含站点公用部分和定义块进行重载. 首先创建一个base.html,源码为: <!DOC ...

  3. Django学习手册 - 模板继承与导入

    核心: PS:一个页面只能继承一个模板. 前置: 配置url. 配置views 关键字: 1. {% extends "index模板.html" %} 声明继承于哪个模板 ,关联 ...

  4. [py][mx]django模板继承-课程列表页

    课程列表页分析 1,机构类型 2,所在地区 3.排序 学习人数 先分析下 纵观页面,页头页脚都一样. django提供了模板继承. 至少 不同页面的title 面包屑路径 content内容不一致,以 ...

  5. Django(4)html模板继承、模板导入、分页实现

    1.获取所有请求信息 导入模块:from django.core.handlers.wsgi import WSGIRequest request.environ:包含所有的请求信息,可以打印看一下, ...

  6. Django 中url补充以及模板继承

    Django中的URL补充 默认值 在url写路由关系的时候可以传递默认参数,如下: url(r'^index/', views.index,{"name":"root& ...

  7. python【第二十一篇】Django模板继承、分页、cookie验证

    1.模板继承 母版master.html {% block title %}{% endblock %}2 {% block table-cont %}{% endblock %} 子板 {% ext ...

  8. Django——模板层(template)(模板语法、自定义模板过滤器及标签、模板继承)

    前言:当我们想在页面上给客户端返回一个当前时间,一些初学者可能会很自然的想到用占位符,字符串拼接来达到我们想要的效果,但是这样做会有一个问题,HTML被直接硬编码在 Python代码之中. 1 2 3 ...

  9. Django(五)框架之模板继承和静态文件配置

    https://www.cnblogs.com/haiyan123/p/7731959.html 一.模板继承 目的是:减少代码的冗余 语法: {% block classinfo %} {% end ...

  10. Django 模板继承

    本质上来说,模板继承就是先构造一个基础框架模板,而后在其子模板中对它所包含站点公用部分和定义块进行重载. 让我们通过修改 current_datetime.html 文件,为 current_date ...

随机推荐

  1. 李洪强IOS开发之iOS好项目收集

    李洪强IOS开发之iOS好项目收集 在这里收集一些最近出现的比较实用好玩的框架或者项目,会不断更新 项目 简述 日期 SCTableViewCell 类似与QQ侧滑删除Cell的Demo 201501 ...

  2. Oracle配置客户端

    一.引言 当我们需要连接远程的Oracle数据库服务器时,就需要在自己的机器上安装Oracle客户端了. 二.安装步骤与配置 参考:http://blog.csdn.net/luiseradl/art ...

  3. html 基本标签 ---字体

    <b> </b>加粗 <i> </i> 斜体 <del> </del> 删除 <ins> </ins> ...

  4. 一次csrf配合xss的攻击实例

    xss出现在我的邮箱处 alert of payload "><script>alert(/test/)</script><" by cooki ...

  5. jqgrid删除多行数据,删不全的解决方案

    功能实现: 删除选中的多条数据 bug: 总是删不干净,比如选中5条执行删除操作,后台全删掉了,可是前台仍然有剩余的几条,再次刷新会不见 错误代码: var ids = $("#grid-t ...

  6. DevelopmentValue

    DevelopmentValue mysql为utf8为什么网页返回数据及写入mysql数据库均为乱码? eclipse运行配了maven之后,创建包也弹出这个错误,每次都弹 c语言怎么建立txt文件 ...

  7. 第二百一十五节,jQuery EasyUI,DateBox(日期输入框)组件

    jQuery EasyUI,DateBox(日期输入框)组件 学习要点: 1.加载方式 2.属性列表 3.事件列表 4.方法列表 本节课重点了解 EasyUI 中 DateBox(日期输入框)组件的使 ...

  8. List、Map、Set三个接口存储元素时各有什么特点?

    List.Map.Set三个接口存储元素时各有什么特点? 解答: 1)List是有序的Collection,使用此接口能够精确的控制每个元素插入的位置.用户能够使用索引(元素在List中的位置,类似于 ...

  9. mysql delimiter 存储过程

    命令行登录mysql cd /d D:\database\mysql1\bin mysql.exe -P 3306 -h 127.0.0.1 -u root -p USE tbschedule del ...

  10. IPMI特点和功能

    IPMI独立于操作系统外自行运作,并容许管理者即使在缺少操作系统或系统管理软件.或受监控的系统关机但有接电源的情况下仍能远程管理系统. ipmi可以实现对机器的操作举例如下: 开机,关机,重启,查看机 ...