使用Flask集成bootstrap的方法


Posted in Python onJuly 24, 2018

1. 下载flask-bootstrap

pip install flask-bootstrap

2. 找到base.html文件

将site-packages\flask_bootstrap\templates文件夹下的bootstrap目录copy到你的项目\templates目录下,确保bootstrap目录下包含base.html文件,因为我们后面要用到。

3. 代码

user.html :

{% extends "bootstrap/base.html" %}

{% block title %}Flask{% 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="/" rel="external nofollow" rel="external nofollow" >Flask</a>
      </div>
      <div class="navbar-collapse collapse">
        <ul class="nav navbar-nav">
          <li><a href="/" rel="external nofollow" rel="external nofollow" >Home</a></li>
        </ul>
      </div>
    </div>
  </div>
{% endblock %}

{% block content %}
  <div class="container">
    <div class="page-header">
      <h1>Hello, {{ name }}</h1>
    </div>
  </div>
{% endblock %}

MyFlask.py :

from flask import Flask, render_template
from flask_bootstrap import Bootstrap

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


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


if __name__ == '__main__':
  app.run()

4. 查看结果

浏览器输入:http://127.0.0.1:5000/user/Brown

结果:

使用Flask集成bootstrap的方法

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Python 相关文章推荐
python实现dict版图遍历示例
Feb 19 Python
Python Web框架Flask信号机制(signals)介绍
Jan 01 Python
在Django的通用视图中处理Context的方法
Jul 21 Python
python条件变量之生产者与消费者操作实例分析
Mar 22 Python
详解利用django中间件django.middleware.csrf.CsrfViewMiddleware防止csrf攻击
Oct 09 Python
python判断文件是否存在,不存在就创建一个的实例
Feb 18 Python
python函数enumerate,operator和Counter使用技巧实例小结
Feb 22 Python
Python下使用Trackbar实现绘图板
Oct 27 Python
pandas apply使用多列计算生成新的列实现示例
Feb 24 Python
如何用python识别滑块验证码中的缺口
Apr 01 Python
关于Numpy之repeat、tile的用法总结
Jun 02 Python
Python OpenCV之常用滤波器使用详解
Apr 07 Python
用python统计代码行的示例(包括空行和注释)
Jul 24 #Python
Python 删除整个文本中的空格,并实现按行显示
Jul 24 #Python
Python常见MongoDB数据库操作实例总结
Jul 24 #Python
Python实现端口检测的方法
Jul 24 #Python
Flask框架信号用法实例分析
Jul 24 #Python
Flask框架响应、调度方法和蓝图操作实例分析
Jul 24 #Python
Django中的Model操作表的实现
Jul 24 #Python
You might like
用PHP和ACCESS写聊天室(九)
2006/10/09 PHP
某大型网络公司应聘时的笔试题目附答案
2008/03/27 PHP
php检测数组长度函数sizeof与count用法
2014/11/17 PHP
解决PHP程序运行时:Fatal error: Maximum execution time of 30 seconds exceeded in的错误提示
2016/11/25 PHP
PHP+MySQL实现消息队列的方法分析
2018/05/09 PHP
jQueryUI如何自定义组件实现代码
2010/11/14 Javascript
JavaScript高级程序设计 阅读笔记(十八) js跨平台的事件
2012/08/14 Javascript
javascript图片相似度算法实现 js实现直方图和向量算法
2014/01/14 Javascript
jquery实现在光标位置插入内容的方法
2015/02/05 Javascript
JavaScript实现的多个图片广告交替显示效果代码
2015/09/04 Javascript
jquery验证邮箱格式并显示提交按钮
2015/11/07 Javascript
jQuery实现获取table表格第一列值的方法
2016/03/01 Javascript
jQuery.ajax实现根据不同的Content-Type做出不同的响应
2016/11/03 Javascript
JS动态的把左边列表添加到右边的实现代码(可上下移动)
2016/11/17 Javascript
JavaScript获取中英文混合字符串长度的方法示例
2017/02/04 Javascript
BootStrap表单时间选择器详解
2017/05/09 Javascript
学习使用Bootstrap页面排版样式
2017/05/11 Javascript
JavaScript实现body内任意节点的自定义属性功能示例
2017/09/18 Javascript
详解vue-cli项目中用json-sever搭建mock服务器
2017/11/02 Javascript
Vue.set() this.$set()引发的视图更新思考及注意事项
2018/08/30 Javascript
Vue 递归多级菜单的实例代码
2019/05/05 Javascript
javascript面向对象程序设计实践常用知识点总结
2019/07/29 Javascript
Typescript3.9 常用新特性一览(推荐)
2020/05/14 Javascript
Python动态导入模块的方法实例分析
2018/06/28 Python
使用Python横向合并excel文件的实例
2018/12/11 Python
python GUI库图形界面开发之PyQt5中QWebEngineView内嵌网页与Python的数据交互传参详细方法实例
2020/02/26 Python
Python3.x+pyqtgraph实现数据可视化教程
2020/03/14 Python
python读取hdfs上的parquet文件方式
2020/06/06 Python
Fresh馥蕾诗英国官网:法国LVMH集团旗下高端天然护肤品牌
2018/11/01 全球购物
巴黎卡诗加拿大官网:Kérastase加拿大
2018/11/12 全球购物
既然说Ruby中一切都是对象,那么Ruby中类也是对象吗
2013/01/26 面试题
物业保安主管岗位职责
2013/12/25 职场文书
护理个人求职信范文
2014/01/08 职场文书
生日宴会答谢词
2014/01/09 职场文书
2015年护士节活动总结
2015/02/10 职场文书
Python自动化之批量处理工作簿和工作表
2021/06/03 Python