16- flask-bootstrap模板的使用

Flask 中支持 flask-bootstrap模板 和 bootstrap-flask模板

python 复制代码
# 不使用: bootstrap-flask
# pip install bootstrap-flask==1.3.1 # 支持bootstrap 4
# pip install flask-bootstrap # 支持bootstrap3

# 中文文档:
        https://flask-bootstrap-zh.readthedocs.io/zh/latest/
# 样式文档:
        https://v3.bootcss.com/getting-started/#download

一. flask-bootstrap 模板使用

(1). 下载: pip install flask-bootstrap

(2). 在 ext / init.py中 创建bootstrap对象

(3). 在 apps/init.py中 初始化bootstrap

二. flask-bootstrap内置block

javascript 复制代码
// bootstrap内置的block
{% block title %}标题{% endblock %}
{% block navbar %}导航栏{% endblock %}
{% block content %}中心内容{% endblock %}
{% block styles %}样式{% endblock %}
{% block srcipts %}脚本{% endblock %}
{% block head %}头{% endblock %}
{% block body %}体{% endblock %}


// styles 和 scripts  需要继承父模板
// 添加css脚本
{% block styles %}
        {{ super() }} // 继承腹肌样式
        <style>  //定义自己样式
            ...
        </style>
{% endblock %}

// 添加js脚本
{% block scripts %}
        {{ super() }}
        <script>
            ...
        </script>
{% endblock %}

三. 代码实例

相关推荐
伍六星1 小时前
Flask和Django,你怎么选?
数据库·django·flask
不争先.2 小时前
coze平台创建智能体,关于智能体后端接入的问题
pycharm·flask·apifox
月疯5 小时前
阿里云Ubuntu 22.04 64位搭建Flask流程(亲测)
linux·ubuntu·flask
白嫖不白嫖9 小时前
Django、Flask、FastAPI与Jupyter对比
django·flask·fastapi
hshpy10 小时前
LangChain in java
java·langchain·flask
Jooolin12 小时前
Flask 入门到实战(2):用 SQLAlchemy 优雅操作数据库
后端·flask·ai编程
Jooolin12 小时前
Flask 入门到实战(2):使用 SQLAlchemy 打造可持久化的数据层
后端·flask·ai编程
Jooolin13 小时前
Flask 入门到实战:手把手带你构建第一个 Python Web 应用
后端·flask·ai编程
开开心心就好17 小时前
免费PDF转图片软件
javascript·智能手机·pdf·flask·word·excel·scikit-learn
码界奇点1 天前
Python Flask文件处理与异常处理实战指南
开发语言·python·自然语言处理·flask·python3.11