①为什么会有模板继承而不用include调用模板：include是引用模板的标签，将模板的内容直接显示，但是当页面有变化的时候，比如多了一个侧边栏的内容，或者想改输入框为按钮，这时候就要去改模板或者创建多个include文件，为了简化代码提高代码复用性，模板继承就应运而生，和类的继承一样，可以重写父模板的方法 ②子模版只能通过block继承和重写父模板的内容，block可以嵌套使用，但是block的名字一定不能重复，接下来以父、子模板，以及引用模块举例在flask中如何使用模板继承 ③父模板(用html写在templates里面，子模板继承的模板，一般都是固定框架，详情页面通过子模版去写)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>{% block title %} Title {% endblock %}</title> </head> <body> {% block header %} <ul> <li>首页</li> <li>课程详情</li> <li>视频教程</li> <li>关于我们</li> </ul> {% endblock %} {% block content %} <h1>这是首页</h1> {% endblock %} <!--block可以嵌套使用但是不能重名--> {% block footer%} <div class="footer"> {% block little%} 这是网站底部 {% endblock %} </div> {% endblock %} <!--一个地方需要用到另外一个block中的内容，可以使用self.blockname的方式进行引用--> <p>{{ self.title() }}</p> </body> </html>④子模版(用html写在templates里面，继承父模板的内容，写详情页面的逻辑)
{% extends 'father_template.html' %} <!--模板的继承要放在block的前面，不然定义在extends的内容block会单独显示出来--> <!--上边的一句话代表继承父模板，子模版只能通过block重写父模板的内容， 单独写的标签不会被渲染出来的，页面不能多继承，只能继承一个父模板--> {% block title%} <!--用super可以实现调用父模板中的额标签，类似于python类中的super继承父类的方法--> {{super()}} 我是子模块标题，我通过title修改了父模板的block {% endblock %} {% block content%} 我是子模块标题，我通过title修改了父模板的block {% endblock %} <!--可以根据父模板的block的名字修改内容，子模板只能改父模板的内容--> {% block little%} heiheihei {% endblock %}⑤py文件(调用子模块显示页面内容，实现逻辑要求，运行python文件就可以看到效果)
from flask import Flask,render_template app = Flask(__name__) app.config['TEMPLATES_AUTO_RELOAD']=True # 配置自动加载模板文件，调试模式下会自动开启 @app.route('/') def index(): # return render_template('index.html') # return render_template('father_template.html') return render_template('son_template.html') @app.route('/list/') def list_article(): return render_template('list.html') if __name__ == '__main__': app.run(debug=True) # 开启调试模式使用CSS样式文件、JavaScript脚本文件、图片文件、字体文件等静态资源使得页面变得更加的美观。在Jinja中加载静态文件非常简单，只需要通过url_for全局函数就可以实现，要注意flask中的文件，源码中都固定好了它的名称(也可以通过改参数修改文件名称，但是最好不要变)，默认文件层级关系如下，通过app = Flask( __ name__,static_folder=‘C:\static’)可以修改文件名称，点击ctrl+鼠标左键也可以去查看flask的源码，它的init初识化方法已经限定了很多默认值(可以修改)，一般用默认值就好
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" href="{{ url_for('static', filename='css/index.css')}}"> <script src="{{ url_for('static', filename='js/index.js')}}"></script> </head> <body> <ul> <li>首页</li> <li>课程详情</li> <li>视频教程</li> <li>关于我们</li> </ul> <h1>这是列表页面</h1> <img src="{{url_for('static',filename='images/hh.png')}}" alt=""> <div class="footer"> 这是网站底部 </div> </body> </html>①目录结构(通过继承，以及宏for语句等flask模板语法实现简单界面搭建以及跳转功能，主要实现代码优化，使得层级分明，为以后的大案例做思想铺垫)
②css样式(文件太多就以图片方便展现) ③宏文件 ④html文件
⑤python代码
from flask import Flask,render_template,request app = Flask(__name__) # 电影 movies = [ { 'id': '11211', 'thumbnail': 'https://img3.doubanio.com/view/movie_poster_cover/lpst/public/p2499792043.webp', 'title': u'王牌特工2：黄金圈', 'rating': u'7.3', 'comment_count': 12000, 'authors': u'科林·费尔斯 / 塔伦·埃格顿 / 朱丽安·摩尔' }, { 'id': '34532', 'title': u'姜子牙', 'thumbnail': u'https://img1.doubanio.com/view/photo/s_ratio_poster/public/p2621219978.webp', 'rating': u'6.9', 'comment_count': 39450, 'authors': u'艾伦/马丽/沈腾' }, { 'id': '394558', 'title': u'情圣', 'thumbnail': u'https://img3.doubanio.com/view/movie_poster_cover/mpst/public/p2409022364.jpg', 'rating': u'6.3', 'comment_count': 38409, 'authors': u'肖央 / 闫妮 / 小沈阳' }, { 'id': '9384089', 'title': u'夺冠', 'thumbnail': u'https://img2.doubanio.com/view/photo/s_ratio_poster/public/p2620083313.webp', 'rating': u'7.3', 'comment_count': 4555, 'authors': u'杰拉德·巴特勒/吉姆·斯特' }, { 'id': '26921827', 'title': u'大卫贝肯之倒霉特工熊', 'thumbnail': u'https://img3.doubanio.com/view/movie_poster_cover/mpst/public/p2408893200.jpg', 'rating': u'4.3', 'comment_count': 682, 'authors': u'汤水雨 / 徐佳琪 / 杨默' }, { 'id': '26287884', 'title': u'追龙', 'thumbnail': u'https://img3.doubanio.com/view/movie_poster_cover/lpst/public/p2499052494.webp', 'rating': u'7.5', 'comment_count': 33060, 'authors': u'查理兹·塞隆 / 阿特·帕金森 / 拉尔夫·费因斯' } ] # 电视剧 tvs = [ { 'id': '235434', 'title': u'鬼吹灯之精绝古城', 'thumbnail': u'https://img3.doubanio.com/view/movie_poster_cover/lpst/public/p2404604903.jpg', 'rating': u'8.4', 'comment_count': 49328, 'authors': u'靳东 / 陈乔恩 / 赵达 / 付枚 / 金泽灏 /' }, { 'id': '9498327', 'title': u'孤芳不自赏', 'thumbnail': u'https://img1.doubanio.com/view/movie_poster_cover/lpst/public/p2407425119.jpg', 'rating': u'3.7', 'comment_count': 8493, 'authors': u'钟汉良 / 杨颖 / 甘婷婷 / 孙艺洲 / 亓航 /' }, { 'id': '26685451', 'title': u'全球风暴', 'thumbnail': u'https://img3.doubanio.com/view/movie_poster_cover/lpst/public/p2501769525.webp', 'rating': u'8.2', 'comment_count': 345, 'authors': u' 卢克·崔德威 / 琼安·弗洛加特 / 露塔·格德米纳斯 / 安东尼·海德 / 卡罗琳·古多尔 /' }, { 'id': '235434', 'title': u'其他人', 'thumbnail': u'https://img3.doubanio.com/view/movie_poster_cover/lpst/public/p2371503632.jpg', 'rating': u'7.6', 'comment_count': 25532, 'authors': u'杰西·普莱蒙 / 莫莉·香侬 / 布莱德利·惠特福德 / Maude Apatow / 麦迪逊·贝蒂 /' }, { 'id': '48373095', 'title': u'全员单恋', 'thumbnail': u'https://img1.doubanio.com/view/movie_poster_cover/lpst/public/p2367986708.jpg', 'rating': u'6.4', 'comment_count': 2483, 'authors': u'伊藤沙莉 / 中川大志 / 上原实矩 / 森绘梨佳 / 樱田通 /' }, { 'id': '292843', 'title': u'废纸板拳击手', 'thumbnail': u'https://img1.doubanio.com/view/movie_poster_cover/lpst/public/p2380194237.jpg', 'rating': u'8.2', 'comment_count': 23456, 'authors': u'托马斯·哈登·丘奇 / 泰伦斯·霍华德 / 波伊德·霍布鲁克 / 瑞斯·维克菲尔德 / 马尔洛·托马斯 /' } ] @app.route('/') def index(): context = { 'movies':movies, 'tvs':tvs, } return render_template('index.html', **context) @app.route('/list/') def movie_list(): category = int(request.args.get('category')) items = None if category==1: items = movies else: items = tvs return render_template('list.html', items=items) if __name__ == '__main__': app.run(debug=True)