flask 动态模板html,HTML|Flask之模板继承

HTML|Flask之模板继承

2021-04-22

1什么是模板继承模板继承是jinja里面最有力的部分了。就相当于在模板里面创建一个基础的骨架,里面的内容一般是一个网站中的常用元素,比如说网页的头部与尾部。这样下次需要用的话我们直接继承就好了。2基础模板我们来新建一个 base.html,它定义了一个简单的 HTML 骨架,用 于显示一个简单的两栏页面。“子”模板的任务是用内容填充空的块:

{% block head %}{% block title %}{% endblock %} - My Webpage{% endblock %}
{% block content %}{% endblock %}
在这个例子中,{% block %}定义了几个可以被子模版填充的地方。接下来我们来写几个子模版:{% extends "test01.html" %}{% block title %}Index{% endblock %}{% block head %}{{ super() }}{% endblock %}{% block content %}

hello

欢迎您{% endblock %}效果如下:这里{% extends %} 标记是关键,它告诉模板引擎这个模板“扩展”了另一个模板, 当模板系统评估这个模板时会先找到父模板。这个扩展标记必须是模板中的第一个标记。如果要使用父模板中的块内容,就要使用 {{ super() }} 。END实习主编 | 王文星责 编 | 刘玉江where2go 团队微信号:算法与编程之美

免责声明:本文仅代表文章作者的个人观点,与本站无关。其原创性、真实性以及文中陈述文字和内容未经本站证实,对本文以及其中全部或者部分内容文字的真实性、完整性和原创性本站不作任何保证或承诺,请读者仅作参考,并自行核实相关内容。

http://image95.pinlue.com/image/63.jpg

要在Flask中使用Flask-Bootstrap来集成Bootstrap框架,你需要进行以下步骤: 1. 首先,使用pip来安装Flask-Bootstrap扩展:`pip install flask_bootstrap`。 2. 在你的Flask应用程序中导入Flask-Bootstrap并初始化它,可以使用以下代码: ``` from flask_bootstrap import Bootstrap app = Flask(__name__) bootstrap = Bootstrap(app) ``` 3. 接下来,你可以创建一个包含所有Bootstrap文件的基模板,通过Jinja2的模板继承机制,让你的程序扩展这个基模板,并引入Bootstrap的元素。在你的模板文件中,可以使用以下代码引用Bootstrap的基模板: ``` {% extends "bootstrap/base.html" %} {% block title %}Flask{% endblock %} ``` 4. 如果你想在你的Flask应用程序中使用Flask-Flash来显示消息,你可以在基模板中添加一个代码块来显示flash消息。在基模板的相应位置,可以使用以下代码来显示flash消息: ``` {% for message in get_flashed_messages() %} <div id="alertmessage" class="alert alert-warning"> <button type="button" class="close" onclick="close_flash_message();">x</button> {{ message }} </div> {% endfor %} ``` 通过以上步骤,你可以在Flask应用程序中使用Flask-Bootstrap来集成Bootstrap框架,并且在基模板中添加代码块来显示flash消息。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *2* [常用Flask的插件bootstrap wtf](https://blog.youkuaiyun.com/qq_41829386/article/details/88360044)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] - *3* [Flask中,不用bootstrap实现flash消息关闭按钮](https://blog.youkuaiyun.com/steventian72/article/details/102960717)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值