flask模版继承和include
作者:互联网
需要继承的情况:
1、多个模版具有相同的顶部和底部
2、多个模版具有相同的模版内容,但是内容部分不一样
3、多个模版具有完全相同的模版内容
标签
{% block 名字 %}
{% endblock %}
1、定义父模版
2、子模版继承父模版
步骤:
父模版:
1、定义一个base.html的模版
2、分析模版中哪些是变化的 比如:{% block tilte %}父模版title{% endblock %} 对变化的部分用block惊醒“预留位置”
3、注意: 样式和脚本 需要提前预留
{% block mycss %}{% endblock %}
{% block myjs %}{% endblock %}
自模版继承父模版:
1、{% extends "父模版名称" %} 将父模版继承过来
2、找到对应的block填充
app.py
from flask import Flask from flask import make_response, request, render_template,redirect,url_for import setting,json app = Flask(__name__) app.config.from_object(setting) @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(host='127.0.0.1', port=5000)
base.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title> {% block title %} 继承 {% endblock %} </title> <style> #head{ height: 50px; background-color: bisque; } #head ul{ list-style: none; height: 50px; } #head ul li{ float: left; width: 100px; text-align: center; font-size: 18px; line-height: 50px; } #middle{ height: 900px; background-color: darkseagreen; } #foot{ height: 50px; line-height: 50px; } </style> </head> <body> <div id="head"> <ul> <li>首页</li> <li>秒杀</li> <li>超市</li> <li>会员</li> </ul> </div> <div id="middle"> {% block middle %} 我是中间部分 {% endblock %} </div> <div id="foot"> {% block foot %} 我是底部部分 {% endblock %} </div> {% block myjs %} <script> btn = document.getElementById('btn') btn.onclick=function (){ alert("别点我啊") } </script> {% endblock %} </body> </html>
index.html
{% extends 'base.html' %} {% block title %} 首页 {% endblock %} {% block middle %} <button id="btn">我是中间部分</button> {% endblock %} {% block foot %} this is foot {% endblock %}
标签:__,flask,模版,html,block,base,include,endblock 来源: https://www.cnblogs.com/fat-girl-spring/p/15262985.html