HTML 模板继承
网站模板的设计,一般的,我们做网站有一些通用的部分,比如 导航,底部,访问统计代码等。合理的规划模板往往会减少工作量,同时也使得罗乱、难以阅读的静态页面布局变得优雅。
假设,我们的网站主页面除了正文是由导航条,低栏,统计栏构成。也就是nav.html,bottom.html,tongji.html。
在构建页面的时候,可以写一个base.html来包含(include)这些通用文件,如下:
<!DOCTYPE html>
<html>
<head>
<title>{% block title %}默认标题{% endblock %}</title>
</head>
<body> {% include 'nav.html' %} {% block content %}
<div>这里是默认内容,所有继承自这个模板的,如果不覆盖就显示这里的默认内容。</div> {% endblock %} {% include 'bottom.html' %} {% include 'tongji.html' %}
</body>
</html>
在这里,所有的include都是引入通用文件,而block都是定义默认模块,其他继承base.html的页面,都可以在自己的页面中重新定义这些模块,达到覆盖替换的作用。
比如我们设计一个主页面index.html,继承自base.html,同时替换base.html中的title和content两个模块。以下是index.html文件的内容:
{% extends 'base.html' %}
{% block title %}欢迎光临首页{% endblock %}
{% block content %} {% include 'ad.html' %} 这里是首页,欢迎光临 {% endblock %}
HTML 模板继承的更多相关文章
- Python自动化之模板继承和cookie
request请求头信息 type(request) //查看类 from django.core.handlers.wsgi import WSGIRequest 结果会以字典的形式存在 reque ...
- Django(4)html模板继承、模板导入、分页实现
1.获取所有请求信息 导入模块:from django.core.handlers.wsgi import WSGIRequest request.environ:包含所有的请求信息,可以打印看一下, ...
- tp框架之模板继承
模板继承是一项更加灵活的模板布局方式,模板继承不同于模板布局,甚至来说,应该在模板布局的上层.模板继承其实并不难理解,就好比类的继承一样,模板也可以定义一个基础模板(或者是布局),并且其中定义相关的区 ...
- Django 中url补充以及模板继承
Django中的URL补充 默认值 在url写路由关系的时候可以传递默认参数,如下: url(r'^index/', views.index,{"name":"root& ...
- Thinkphp3.2中的模板继承
1:模板继承: 是3.1.2版本添加的一项更加灵活的模板布局方式,模板继承不同于模板布局,甚至来说,应该在模板布局的上层.模板继承其实并不难理解,就好比 类的继承一样,模板也可以定义一个基础模板( ...
- Django1.9开发博客(6)- 模板继承
模板继承就是网站的多个页面可以共享同一个页面布局或者是页面的某几个部分的内容.通过这种方式你就需要在每个页面复制粘贴同样的代码了. 如果你想改变页面某个公共部分,你不需要每个页面的去修改,只需要修改一 ...
- thinkphp中模板继承
模板继承是3.1.2版本添加的一项更加灵活的模板布局方式,模板继承不同于模板布局,甚至来说,应该在模板布局的上层.模板继承其实并不难理解,就好比类的继承一样,模板也可以定义一个基础模板(或者是布局), ...
- python【第二十一篇】Django模板继承、分页、cookie验证
1.模板继承 母版master.html {% block title %}{% endblock %}2 {% block table-cont %}{% endblock %} 子板 {% ext ...
- php随机10-thinkphp 3.1.3 模板继承 布局
8.25 模板继承 模 板继承是3.1.2版本添加的一项更加灵活的模板布局方式,模板继承不同于模板布局,甚至来说,应该在模板布局的上层.模板继承其实并不难理解,就好比类 的继承一样,模板也可以定义一个 ...
- tp框架---View视图层---模板继承(举例说明)
当我们做动态页面时,我们会发现一个网站的头部和尾部是相同的,那么我们如何用tp框架来做模板呢 ? 先看一下注意事项: (1)每个区块由<block></block>标签组成 ( ...
随机推荐
- 49、多线程创建的三种方式之继承Thread类
继承Thread类创建线程 在java里面,开发者可以创建线程,这样在程序执行过程中,如果CPU空闲了,就会执行线程中的内容. 使用Thread创建线程的步骤: 1.自定义一个类,继承java.lan ...
- 双击CAD对象,显示自定义对话框实现方法
class TlsApplication : IExtensionApplication { void IExtensionApplication.Initialize() { TTest.Start ...
- 关于UNIX的exec函数
在UNIX系统中,系统为进程相关提供了一系列的控制原语,包括:进程fork,进程exit,进程exec,进程wait等服务. 该篇文章主要与进程exec服务有关,并记录了几个需要注意留意的点. 照例给 ...
- 2016.6.21——Climbing Stairs
Climbing Stairs 本题收获: 1.斐波那契函数f(n) = f(n-1) + f(n -2) 题目: You are climbing a stair case. It takes n ...
- 加密文件之Java改进版
对应Python版:加密文件之Python版Java版比Python版要快得多,两个版本不在一个量级上.在加密解密1G大文件时,Java版花费的时间是秒级,而Python版花费的时间是10分钟级. i ...
- ETL利器Kettle实战应用解析系列三
本系列文章主要索引如下: 一.ETL利器Kettle实战应用解析系列一[Kettle使用介绍] 二.ETL利器Kettle实战应用解析系列二 [应用场景和实战DEMO下载] 三.ETL利器Kettle ...
- 2017北京网络赛 Bounce GCD加找规律
题目链接:http://hihocoder.com/problemset/problem/1584 题意:就是求一个小球从矩阵的左上角,跑到矩形的右下角不能重复经过的格子,小球碰到墙壁就反射. 解法: ...
- Python开发环境(2):启动Eclipse时检测到PYTHONPATH发生改变
OS:Windows 10家庭中文版,Eclipse:Oxygen.1a Release (4.7.1a),PyDev:6.3.2 4月25日,在Eclipse上安装了PyDev(前面博文有记录),并 ...
- MyEclipse中点击Deploy MyEclipse J2EE Project to Server无响应解决方法
问题: MyEclipse中点击Deploy MyEclipse J2EE Project to Server无响应 解决方法: 如果工作空间的问题,那么需要删除你工作空间的一个文件就可以解决了.这个 ...
- 解决Url带中文参数乱码问题
这里我来介绍下如何配置Tomcat 来解决Url带中文参数乱码问题: 首先打开Tomcat安装目录,以Tomcat7为例,其他版本基本一样: 打开conf文件 打开server.xml 大概在70行左 ...