shark

• 安装 pip install flask-bootstrap
• 初始化

from flask import Flask, render_template
from flask_bootstrap import Bootstrap

app = Flask(__name__)
bootstrap = Bootstrap(app)

@app.route('/')
def index():
    return render_template("index.html")

@app.route('/user/<name>')
def user(name):
    return render_template("user.html", name=name)

if __name__ == "__main__":
    app.run(debug=True)

• templates/user.html

{% extends "bootstrap/base.html" %}
{% block title %}Flasky{% endblock %}
{% block navbar %}
<div class="navbar navbar-inverse" role="navigation">
    <div class="container">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" href="/">Flasky</a>
        </div>
        <div class="navbar-collapse collapse">
            <ul class="nav navbar-nav">
                <li><a href="/">Home</a></li>
            </ul>
        </div>
    </div>
</div>
{% endblock %}
{% block content %}
<div class="container">
    <div class="page-header">
        <h1>Hello, {{ name }}!</h1>
    </div>
</div>
{% endblock %}

• Jinja2 中的 extends 指令从 Flask-Bootstrap 中导入 bootstrap/base.html

• 上面这个 user.html 模板定义了 3 个块，分别名为 title 、 navbar 和 content 。这些块都是
  基模板提供的，可在衍生模板中重新定义

• Flask-Bootstrap 的 base.html 模板还定义了很多其他块，都可在衍生模板中使用

块　　名	说　　明
doc	整个 HTML 文档
html_attribs	html 标签的属性
html	html标签中的内容
head	head 标签中的内容
title	title 标签中的内容
metas	一组 meta 标签
styles	层叠样式表定义
body_attribs	body标签的属性
body	body标签中的内容
navbar	用户定义的导航条
content	用户定义的页面内容
scripts	文档底部的 JavaScript 声明