Project name :Flask_Plan

templates:templates

static:static

继续上一篇文章。

我们不希望每个页面都写一遍引入js,css,导航条………………

那么我们使用模板继承的方法。

首先修改templates/plan.html 为 templates/base.base

再创建一个plan.html

{%  extends 'base.html' %}

代码真的只有这一行,别找了。

重新访问我们的页面。

你会发现和没改之前一样。

这个时候模板plan.html就继承了base.html当中的所有内容。

下面修改base.html,给基础模板留下位置标识,让继承这个模板的子模板,知道要修改什么地方内容。

 <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Title</title>
<!-- Bootstrap -->
<link href="{{ url_for('static', filename='css/bootstrap.css')}}" rel="stylesheet">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="{{ url_for('static', filename='js/html5shiv.min.js') }}"></script>
<script src="{{ url_for('static', filename='js/respond.min.js') }}"></script>
<![endif]-->
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="{{ url_for('static', filename='js/jquery-3.2.1.min.js') }}"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="{{ url_for('static', filename='js/bootstrap.js') }}"></script>
</head>
<body>
<h1>这是计划页面</h1>
<img src="{{ url_for('static', filename='test.png') }}">
<!--以下两行为新增加-->
{% block main1 %}{% endblock %}
{% block main2 %}{% endblock %}
<!--以上两行为新增加-->
</body>
</html>

再修改plan.html

{%  extends 'base.html' %}
{% block main1 %}
<h1>这是main1提交的新内容</h1>
{% endblock %}
{% block main2 %}
<h3>这是main2提交的新内容</h3>
{% endblock %}

好了,可以看到,我们可以在base这个基础模板中留下位置,给子模板,子模板可以在指定未知添加我们需要的内容。

Flask初级(五)flash在模板中使用继承,模板的模板的更多相关文章

  1. Win10系列:JavaScript 项目模板中的文件和项模板文件

    通过上面内容的学习,相信读者已经对各种项目模板和项模板有了大致的了解,本节将进一步介绍项目模板中默认包含的项目文件以及项模板文件,首先讲解这些文件中的初始内容以及作用,然后介绍在一个页面中如何添加控件 ...

  2. JAVA笔记整理(五),JAVA中的继承

    1.继承的概念 继承是类与类的一种关系,是一种“is a”的关系 2.继承的好处 子类拥有父类的所有属性和方法,从而实现代码复用 4.方法的重写(Overridding) 如果子类对于继承自父类的方法 ...

  3. thinkPHP 模板中的语法

    一.导入CSS和JS文件   1.css link       js  scr        <link rel='stylesheet' type='text/css' href='__PUB ...

  4. Flask08 包含(include)、继承(extends)、宏???、模板中变量的来源、利用bootstrap构建自己的网页结构

    1 包含 直接把另一个文件的内容,复制粘贴过来 {% include "模板路径" %} 注意:模板都是放在 templates 这个文件夹下面的,可以在里面新建文件夹来进行分离: ...

  5. 模板中的 TemplateBinding 问题

    昨天一个朋友向我求助一个自定义水印控件绑定的问题,问题出在文本框中输入的文本,不能绑定到 相应的依赖属性上(自定义的依赖属性 PassText),他纠结了很久找不出问题所在.问题帮他解决后,这里稍 做 ...

  6. django模板中的extends和include使用方法

    一.extends使用方法 首先extends也就是继承,子类继承父类的一些特性.在django模板中通过继承可以减少重复代码. 首先我们建立一个app,名字叫做hello.别忘了在settings. ...

  7. Django模板自定义标签和过滤器,模板继承(extend),Django的模型层

    上回精彩回顾 视图函数: request对象 request.path 请求路径 request.GET GET请求数据 QueryDict {} request.POST POST请求数据 Quer ...

  8. Flask初级(七)flash模板循环,判断

    Project name :Flask_Plan templates:templates static:static 继续前面的代码 修改Flask_Plan.py @app.route('/') d ...

  9. Flask初级(六)flash模板渲染

    Project name :Flask_Plan templates:templates static:static 继续上篇的模板 我们已经可以静态调用模板,包括继承模板,保证了页面的一致性,但是我 ...

随机推荐

  1. Python3基础 tuple 通过拆分元组向元组中加入新的元素

             Python : 3.7.0          OS : Ubuntu 18.04.1 LTS         IDE : PyCharm 2018.2.4       Conda ...

  2. BZOJ3297: [USACO2011 Open]forgot DP+字符串

    Description 发生了这么多,贝茜已经忘记了她cowtube密码.然而,她记得一些有用的信息.首先,她记得她的密码(记为变 量P)长度为L(1 <= L<=1,000)字符串,并可 ...

  3. BZOJ5170: Fable 树状数组

    Description 有这么一则传闻,O(nlogn)的排序发明之前,滋滋国的排序都是采用的冒泡排序.即使是冒泡排序,对当时的国民 来说也太复杂太难以理解,于是滋滋国出现了这样一个职业——排序使,收 ...

  4. mysql删除sql表添加别名及删除sql的注意事项

    本文为博主原创,未经允许不得转载: 根据平常的习惯,个人会将操作的表后面添加一个别名,无论是使用还是不使用的时候,均是为了 修改还是扩展sql的时候更加安全,方便,快捷. 今天在写删除的sql时,对表 ...

  5. 【异常记录(八)】 This operation requires IIS integrated pipeline mode.

    突然提示这个Error: Server Error in '/' Application. This operation requires IIS integrated pipeline mode. ...

  6. Apache的安装与卸载

    安装 1.下载压缩包并解压到D盘根目录(目录自定义) 2.用记事本打开D:\Apache\conf\httpd.conf,找到Define SRVROOT 把值改为上一步的路径,如Define SRV ...

  7. Python四大主流网络编程框架

    目前的4种主流Python网络框架:Django.Tornado.Flask.Twisted.

  8. spring boot打war包发布

    由于公司一贯的方式都是将war包布在中间件tomcat下运行 所以这次springboot项目需要打war包 how to? 第一步:pom.xml 文件中,打包方式需要修改成war <pack ...

  9. Python 爬虫-Scrapy框架基本使用

    2017-08-01  22:39:50 一.Scrapy爬虫的基本命令 Scrapy是为持续运行设计的专业爬虫框架,提供操作的Scrapy命令行. Scrapy命令行格式 Scrapy常用命令 采用 ...

  10. php 邮件发送利器 PHPMailer

    php 自带的邮件发送函数已经弱到不能用了. PHPMailer非常的强大. 绝对是php里必须使用的程序. 下载地址: https://github.com/Synchro/PHPMailer 只要 ...