如何使用Flask-Bootstrap


Flask-Bootstrap：Flask扩展名，可轻松创建Bootstrap风格的应用程序

安装

1
$ pip install flask-bootstrap

如何使用

1.创建一个Bootstrap实例

1
2
3
4
5
from flask import Flask
from flask_bootstrap import Bootstrap

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

2.创建模板

  • extends "bootstrap/base.html"并继承引导程序模板

  • 适当描述诸如title navbar content之类的块

    • 1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    {% extends "bootstrap/base.html" %}
    {% block title %}This is an example page{% endblock %}

    {% block navbar %}
    <div class="navbar navbar-fixed-top">
      <!-- ... -->
    </div>
    {% endblock %}

    {% block content %}
      <h1>Hello, Bootstrap</h1>
    {% endblock %}

    根据需要使用super()(script和style块必需)

    1
    2
    3
    4
    {% block scripts %}
    <script src="{{url_for('.static', filename='myscripts.js')}}"></script>
    {{super()}}
    {% endblock %}

    方便的宏

    Flask-WTF

    易于创建Bootstrap样式的表单

    1
    2
    {% import "bootstrap/wtf.html" as wtf %}
    {{ wtf.quick_form(form) }}