Flask016_模板继承

  • 父模板 base.html
 1 <!DOCTYPE html>
 2 <html lang="en">
 3 
 4 <head>
 5     <meta charset="UTF-8">
 6     <meta http-equiv="X-UA-Compatible" content="IE=edge">
 7     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 8     <title>{% block title %}{% endblock %}</title>
 9     {% block head %}{% endblock %}
10 </head>
11 
12 <body>
13     <div id="body">{% block body %}{% endblock %}</div>
14     <div id="footer">
15         {% block footer %}
16         &copy;Copyright 2023 by <a href="#">about me</a>
17         {% endblock %}
18     </div>
19 
20 </body>
21 
22 </html>
  • 子模板 index.html
 1 {% extends "base.html" %}
 2 {% block title %}首页{% endblock %}
 3 {% block head %}
 4 <style type="text/css">
 5     .detail {
 6         color: red;
 7     }
 8 </style>
 9 {% endblock %}
10 
11 {% block body %}
12 
13 <h1>{{ self.title() }}</h1>
14 <p class="detail">首页的内容</p>
15 {% endblock %}
16 
17 {% block footer %}
18 {{ super() }}
19 <p>子模版的页脚</p>
20 {% endblock %}
  • 调用
1 @app.route("/")
2 def index():
3     return render_template("index.html")
  • 效果

 

posted @ 2023-05-31 10:31  jason2018  阅读(8)  评论(0)    收藏  举报