高安全性的内容管理系统
一站式建站解决方案
高性能静态网站构建工具
精美的网站模板库
详细的模板开发指南
完整的API接口说明
直观的视频使用指南
常见问题解答集锦
最新产品动态与行业资讯
了解我们的故事
获取支持与合作
extends
模板的继承有点像 ppt 中的母版一样，我们定义好一个骨架，将一个页面都写好，大部分不用变动，需要变动的部分使用 block 标签包裹起来：
{% block title %} <title>base</title> <!-- 如果扩写了就是扩写的，不扩写就还是用base --> {% endblock %}
这样定义的好处是，可以在继承它的模板中，重写这个 block，不重写就按母版来显示。 比如我们定义了一个 base.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> {% block title %} <title>base</title> <!-- 如果扩写了就是扩写的，不扩写就还是用base --> {% endblock %} <!-- 最新版本的 Bootstrap 核心 CSS 文件 --> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> <style> * { margin: 0; padding: 0; } .header { width: 100%; height: 50px; background-color: #369; } </style> </head> <body> <div class="header"></div> <div class="container"> <div class="row"> <div class="col-md-3"> {% include 'aside.html' %} </div> <div class="col-md-9"> {% block content %} <h4>content</h4> {% endblock %} </div> </div> </div> </body> </html>
然后在 index.html 中继承这个 base.html
{% extends 'base.html' %} {% block title %} <title>index</title> {% endblock %} {% block content %} <div class="col-md-9"> <h3>index</h3> <p>index content</p> </div> {% endblock %}
这样就是使用 base.html 作为母版，并在 index.html 中重写了 title、content 两个部分。
注意：如果你在模版中使用 {% extends %} 标签，它必须是模版中的第一个标签。其他的任何情况下，模版继承都将无法工作。
在使用继承的情况下，尽可能将可能会变动的数据，都包裹在 block 中，因为 block 即使在后续的页面不重写，也不影响模板的解析，而需要重写的时候就更方便。
同样地，如果后续写到某一块，发现多个页面都需要使用到，那么这时候，就把添加到 base.html 中去，让它成为母版的一部分。