基础模板
在这个叫做 layout.html 的模板中定义了一个简单的 HTML 文档骨架,你可以将这个骨架用作一个简单的双栏页面。而子模板负责填充空白的 block:
<!doctype html><html><head>{% block head %}<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}"><title>{% block title %}{% endblock %} - My Webpage</title>{% endblock %}</head><body><div id="content">{% block content %}{% endblock %}</div><div id="footer">{% block footer %}© Copyright 2010 by <a href="http://domain.invalid/">you</a>.
{% endblock %}</div></body>
在这个例子中,使用 {% block %} 标签定义了四个子模板可以重载的块。 block 标签所做的的所有事情就是告诉模板引擎: 一个子模板可能会重写父模板的这个部分。
子模板
子模板看起来像这个样子:
{% extends "layout.html" %}{% block title %}Index{% endblock %}{% block head %}{{ super() }}<style type="text/css">.important { color: #336699; }</style>{% endblock %}{% block content %}<h1>Index</h1><p class="important">
Welcome on my awesome homepage.
{% endblock %}