Django之html-模板继承
2024-08-26 03:22:08
在编程的过程中,我们经常会重复性的写了很多的代码,比如一个页面的框架部分,这样我又多少个页面就得写上多少次,这样既不好维护,也不够高效,所以我们引出了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>首页 ></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 %}
最新文章
- C++ map的基本操作和使用
- 关于多个block问题
- Linux信号类型说明
- Linux下Qt的安装与配置
- jlink安装
- 获取设备唯一标识 uuid(采用第三方库SSKeychain)
- Nginx安全配置
- C#中的线程(三) 使用多线程
- C 双向链表
- maven plugin在tomcat 热部署
- css_day6
- SQL Server 添加一条数据获取自动增长列的几种方法
- Dylans loves numbers
- Jenkins实践之入门体验
- 纯CSS修改checkbox复选框样式-02
- where 常用条件范例
- Java的优先级任务队列的实践
- 项目中 2个或者多个EF模型 表名称相同会导致生成的实体类 覆盖的解决方法
- LODOP选择路径,保存写入word文件
- java 递归 树形
热门文章
- ToStringBuilder学习(一):常用方法介绍
- JS高程3:Ajax与Comet-进度事件、跨源资源共享
- xgboost 安装
- codeForces 574b Bear and Three Musketeers
- linux学习笔记22---命令diff和diff3
- 第一周python入门
- 解决Deepin每次打开Chome都提示解锁登录密钥环的麻烦
- chckbox多选
- requestAnimationFrame 实现JS动画
- No transactional EntityManager available; nested exception is javax.persistence.TransactionRequiredException: No transactional EntityManager available