Python_Flask 模板继承

最新推荐文章于 2024-04-24 00:02:20 发布
最新推荐文章于 2024-04-24 00:02:20 发布
阅读量650 收藏
点赞数
分类专栏： Python_Flask Python
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/erfan_lang/article/details/119884490
版权

目录

一

代码一

# -*- codeing = utf-8 -*-
# @Time : 2021/8/23 14:09
# @Author : 二帆
# @File : app1.py
# @Software : PyCharm

from flask import Flask,render_template
import settings

app = Flask(__name__)
app.config.from_object(settings)

@app.route('/base')
def load_base():
    return render_template('base.html')

@app.route('/')
def index():
    return render_template('index.html')

if __name__ == '__main__':
    app.run()



# -*- codeing = utf-8 -*-
# @Time : 2021/8/20 10:28
# @Author : 二帆
# @File : settings.py
# @Software : PyCharm

ENV = 'development'
DEBUG = True

# @File : index.html
{% extends 'base.html' %}

{% block title %}
     首页
{% endblock %}

{% block mycss %}
     <style>
        #middle{
            background-color: cornflowerblue;
            color: red;
            font-weight: bold;
     </style>
{% endblock %}

{% block myjs %}
    <script>
        btn = document.getElementById('btn')
        btn.onclick=function(){
            alert('别点我！')
        }
    </script>
{% endblock %}


# @File : base.html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{% block title %}父模板的title{% endblock %}</title>
    <style>
        #head{
            height:50px;
            background-color: bisque;
        }
        #head ul{
            list-style: none;
        }
        #head ul li{
            float: left;
            width:100px;
            text-align: center;
            font-size:18px;
            height:50px;
            line-height: 50px;
        }
        #middle{
            height: 600px;
        }
        #foot{
            height: 50px;
            line-height: 50px;
            background-color: darkcyan;
        }
    </style>
    {% block mycss %}{% endblock %}
</head>
<body>
    <div id="head">
        <ul>
            <li>首页</li>
            <li>秒杀</li>
            <li>超市</li>
            <li>会员</li>
            <li>图书</li>
        </ul>
    </div>
    <div id="middle">
        {% block middle%}
            <button id="btn">我是中间部分</button>
        {% endblock %}
    </div>
    <div id="foot">
        我是底部
    </div>
    {% block myjs %}

    {% endblock %}
</body>
</html>

展示一

在这里插入图片描述

在这里插入图片描述
在这里插入图片描述

总结一

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

二

代码二

# -*- codeing = utf-8 -*-
# @Time : 2021/8/23 14:09
# @Author : 二帆
# @File : app1.py
# @Software : PyCharm

from flask import Flask,render_template
import settings

app = Flask(__name__)
app.config.from_object(settings)

@app.route('/base')
def load_base():
    return render_template('base.html')

@app.route('/')
def index():
    return render_template('index.html')

if __name__ == '__main__':
    app.run()



#index.html

{% extends 'base.html' %}

{% block title %}
     首页
{% endblock %}

{% block mycss %}
     <style>
        #middle {
            background-color: cornflowerblue;
            color: red;
            font-weight: bold;
        }
        .div1{
            width: 33%;
            float: left;
            border: 1px solid red;
            height: 500px;
        }
     </style>
{% endblock %}

{% block myjs %}
    <script>
        btn = document.getElementById('btn')
        btn.onclick=function(){
            alert('别点我！')
        }
    </script>
{% endblock %}

{% block middle %}
    <div class='div1'></div>
    <div class='div1'></div>
    <div class='div1'></div>
{% endblock %}

#base.html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{% block title %}父模板的title{% endblock %}</title>
    <style>
        #head{
            height:50px;
            background-color: bisque;
        }
        #head ul{
            list-style: none;
        }
        #head ul li{
            float: left;
            width:100px;
            text-align: center;
            font-size:18px;
            height:50px;
            line-height: 50px;
        }
        #middle{
            height: 600px;
        }
        #foot{
            height: 50px;
            line-height: 50px;
            background-color: darkcyan;
        }
    </style>
    {% block mycss %}{% endblock %}
</head>
<body>
    <div id="head">
        <ul>
            <li>首页</li>
            <li>秒杀</li>
            <li>超市</li>
            <li>会员</li>
            <li>图书</li>
        </ul>
    </div>
    <div id="middle">
        {% block middle%}
            <button id="btn">我是中间部分</button>
        {% endblock %}
    </div>
    <div id="foot">
        我是底部
    </div>
    {% block myjs %}

    {% endblock %}
</body>
</html>

展示二

在这里插入图片描述

总结二

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

总结

标签

{% block 名字%}

{% endblock %}
1.定义父模板
2.子模板继承父模板

在这里插入图片描述

步骤

父模板

1.定义一个base.html模板
2. 分析模板中那些是变化的比如： {% block title %}父模板的title{% endblock %}
3. 对变化的部分用block进行“预留位置”，也称作挖坑
4. 注意：样式和脚本：需要提前预留
5
在这里插入图片描述

子使用覆父模板

1.在这里插入图片描述
在这里插入图片描述
2.找到对应的block，每一个block都是有名字的
在这里插入图片描述

Yicsr
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Python-Flask 快学
weixin_68789096的博客
11-27 912
方法1: 通过Flask对象(app)的add_template_filter方法return line + "--嘻嘻嘻"# 可以给过滤器器一个名字，如果没有，默认就是函数的名字方法2: 使用装饰器来实现# 使用装饰器事项过滤器，# 如果不传入参数，默认过滤器名字就是函数的名字return line + "--嘻嘻嘻"方法说明创建所有表删除所有表初始化应用程序。
app = Flask(__name__) 是个什么东西
重剑无锋博客
08-11 3321
"""第一部分，初始化：所有的Flask都必须创建程序实例， web服务器使用wsgi协议，把客户端所有的请求都转发给这个程序实例 程序实例是Flask的对象，一般情况下用如下方法实例化 Flask类只有一个必须指定的参数，即程序主模块或者包的名字，__name__是系统变量，该变量指的是本py文件的文件名""" fromflaskimportFlask app=Flask(__name__) # 第二部分，路由和视...
Flask之app = Flask(__name__)
晴天的博客
05-26 2410
初始化的flask实例中，app = Flask(name)，Flask参数有多个，其中必填的只有import_name，具体说明如下： 1、import_name import_name：Flask程序所在的包(模块)，必传参数，传__name__就可以 from flask import Flask app = Flask(__name__) 2、static_url_path static_url_path：静态文件访问路径，可以不传，不传时默认为：/ + static_folder 3、stat
Flask基本使用
最新发布
qq_57629629的博客
04-24 277
flask基本使用 入门
Flask框架 app = Flask(__name__)
weixin_30636089的博客
06-21 2052
1 from flask import Flask 2 app = Flask(__name__) 3 @app.route('/') 4 def hello_world(): 5 return 'Hello World!' 6 if __name__ == '__main__': 7 app.run(host='0.0.0.0', port=9000) 第1行...
flask教程2：app对象的初始化和配置
总裁余（余登武）博客
12-07 2290
flask教程2：app对象的初始化和配置
Flask的奥秘三
qq_41888962的博客
06-18 174
一、flask的路由装饰器 app = Flask(__name__) @app.route("/", methods=['get', 'post']) def fun(): return "hello world" 上面的代码时flask的视图函数，由@app.route("/", methods=[‘get’, ‘post’]),来控制访问路径，源码如下： def route(self, rule, **options): def decorator(f): end
python_flask_code配套资料
12-16
综上，"python_flask_code配套资料"可能包含Flask基础教程、示例代码、模板设计、数据库操作以及错误处理等多个方面的内容，对于学习和实践Python Flask Web开发非常有帮助。通过深入学习和实践这些资料，你可以掌握...
CS651_Python_Flask_Group8
03-09
【标题】"CS651_Python_Flask_Group8" 涉及的主要知识点是Python编程语言以及Flask框架的应用。这很可能是一个大学课程项目，由第八组的学生完成，专注于使用Python的Flask框架来构建Web应用。 【Python】： Python...
flask_pythonflask_flask书籍_图书管理系统_
10-03
Flask是一个基于Werkzeug WSGI工具包和Jinja2模板引擎的微型Python Web框架。它提供了基本的路由、模板渲染和HTTP请求处理功能，使得开发者能够快速搭建自己的Web应用。在图书管理系统的实现中，Flask将作为核心框架...
python-flask-microservice_Flask框架_flask_phyton_
09-30
Flask是一个Python的Web服务器网关接口（WSGI）微型Web框架，它不包含任何特定的数据库、模板引擎或表单验证等组件。这使得开发者可以根据需求自由选择适合的库和工具进行集成，如描述中的"python flask easyui"，...
Python_para_todos.rar_python_python manual
09-22
11. **Web开发**：Python的Django和Flask框架广泛应用于Web开发，提供了MVC架构、路由、模板和数据库集成等功能。 12. **数据分析与科学计算**：Python的NumPy、Pandas和Matplotlib等库在数据分析和科学计算领域...
Flask 框架app = Flask(__name__) 解析
热门推荐
ChristopherChen的博客
01-20 1万+
#!/usr/local/bin/python # coding=utf-8 from flask import Flask app = Flask(__name__) @app.route('/') def hello_world(): return 'Hello World!' if __name__ == '__main__': app.run(host='0.0.0.
Flask（二）
weixin_53909748的博客
07-16 172
flask
详解Python的Flash框架的常用语句 app = Flask(__name__),为什要以全局变量__name__作为初始化参数？
昊虹AI笔记
05-25 1184
详解Python的Flash框架的常用语句 app = Flask(__name__),为什要以全局变量__name__作为初始化参数？
Python之Flask框架应用(一)
houzeyu666的博客
10-23 533
########Flask框架#######       ## 对于flask框架的理解  -    对于Flask框架而言，它属于众多Python Web开发框架的一种，如果说Django是一个自带后台管理的全能型的框架，那么Flask则是一种非常轻便使用的框架，它提供了搭建Web服务的必要组建，并且具有良好的扩展性。     ## 对于Flask的基本用法理解   - 导入...
flask 路由功能
干燥的空气，湿润的呼吸
11-15 309
默认代码 from flask import Flask # 创建flask应用对象 # __name__表示当前模块的名字 # flask 以这个模块所在目录为总目录，默认这个目录的static为静态目录，templates为模板目录 app = Flask(__name__) @app.route("/") def index(): """定义的视图函数""" retur...
实现Flask入门应用
weixin_69086309的博客
04-23 640
# 实现步骤: # 1.导入Flask类 from flask import Flask # 2.实例化Flask对象 app = Flask(__name__) # 3.编写路由与视图 @app.route('/') def index(): return 'Hello Flask' # 4.启动服务 if __name__ == '__main__': app.run()
Flask框架初始化、配置参数、运行参数说明
IT之一小佬的博客
08-03 2876
Flask框架初始化、配置参数、运行参数说明
使用Python的Flask框架构建Web应用实战指南
3. **模板引擎**：Flask 使用 Jinja2 作为默认的模板引擎，书中会讲解如何使用模板语言来创建动态HTML页面，包括变量、控制流和继承等概念。 4. **数据库集成**：Flask 支持多种数据库，如SQLite或PostgreSQL。书中...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值