jinja2模板系统-模板的继承-基础模板-腾讯新闻模板
看到腾讯新闻没多文章都是一样的版式，题目会有一个模板
咱们也写一个框架模板出来
导航区域
主体区域
边栏区域
内容区先不写，每一个页面都不一样
以上是导航栏和边框，我们加一些样式
内容区的处理（主要）
页面主体样式。以后不用写导航栏和边栏了
新建立页面 子页面
继承
继承用extends
![[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-PX95zXZM-1576567735423)(img/1576565841137.png)]](https://img-blog.csdnimg.cn/20191217153329678.png)
导入base页面
填充某一块的block
![[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-1zcwlSF0-1576567735424)(img/1576565904574.png)]](https://img-blog.csdnimg.cn/20191217153346635.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM1NDU2MDQ1,size_16,color_FFFFFF,t_70)
![[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-NmrY06Pd-1576567735425)(img/1576566057710.png)]](https://img-blog.csdnimg.cn/20191217153410268.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM1NDU2MDQ1,size_16,color_FFFFFF,t_70)
说明：
继承了父界面
填充区域
新写一个app
ok
![[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-rMDa8zny-1576567735426)(img/1576566095907.png)]](https://img-blog.csdnimg.cn/20191217153447985.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM1NDU2MDQ1,size_16,color_FFFFFF,t_70)
回顾总结
看源代码，这一部分是拼凑的
![[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-LKEFH7DJ-1576567735426)(img/1576566120445.png)]](https://img-blog.csdnimg.cn/20191217153500215.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM1NDU2MDQ1,size_16,color_FFFFFF,t_70)
尝试抠出边栏
父界面扣除。![[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-cErBN5SS-1576567735427)(img/1576566285162.png)]](https://img-blog.csdnimg.cn/20191217153514685.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM1NDU2MDQ1,size_16,color_FFFFFF,t_70)
也可以有默认的内容
![[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-weZF5mnO-1576567735427)(img/1576566310599.png)]](https://img-blog.csdnimg.cn/20191217153536198.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM1NDU2MDQ1,size_16,color_FFFFFF,t_70)
