iis服务器助手广告广告
返回顶部
首页 > 资讯 > 精选 >Flask中Bootstrap的使用方法
  • 557
分享到

Flask中Bootstrap的使用方法

2023-06-14 16:06:03 557人浏览 薄情痞子
摘要

小编给大家分享一下flask中Bootstrap的使用方法,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!在视图的选择上,我们已经学习了模板引擎的方法。不过有些小伙

小编给大家分享一下flask中Bootstrap的使用方法,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!

在视图的选择上,我们已经学习了模板引擎的方法。不过有些小伙伴追求开发的效率,这里我们推荐使用Bootstrap。我们把它以插件的形式安装在框架中,然后进行初始化。

1、要初始化bootstrap,如下:

from flask.ext.bootstrap import Bootstrap bootstrap = Bootstrap(app)

2、页面模板放到项目的"templates/"目录下,我们定制一个自己的基模板,base.html,代码如下:

{% extends "bootstrap/base.html" %} {% block head %}    {{ super() }}    <link rel="shortcut icon" href="{{ url_for('static', filename = 'favicon.ico') }}" type="image/x-icon">    <link rel="icon" href="{{ url_for('static', filename = 'favicon.ico') }}" type="image/x-icon">{% endblock %} {% block title %}JolieBaby{% endblock %} {% block navbar %}<div class="navbar navbar-default navbar-static-top">    <div>        <div>            <button type="button" data-toggle="collapse" data-target="#navbar-ex-collapse">                <span>Toggle navigation</span>                <span></span>                <span></span>                <span></span>            </button>            <a href="#"><span>JolieBaby</span></a>        </div>        <div class="collapse navbar-collapse" id="navbar-ex-collapse">            <ul class="nav navbar-nav navbar-right">                <li>                    <a href="#">Home</a>                </li>                <li>                    <a href="#">Contacts</a>                </li>            </ul>        </div>    </div></div>{% endblock %}{% block content %}    {% block page_content %}     {% endblock %}{% endblock %}说下重点代码:{% extends "bootstrap/base.html" %}

3、"bootstrap/base.html"就是Flask-Bootstrap自带的基模板,我们自己的基模板也要继承它。

{% block head %} {% endblock %}

以上是“Flask中Bootstrap的使用方法”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注编程网精选频道!

--结束END--

本文标题: Flask中Bootstrap的使用方法

本文链接: https://www.lsjlt.com/news/272736.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • Flask中Bootstrap的使用方法
    小编给大家分享一下Flask中Bootstrap的使用方法,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!在视图的选择上,我们已经学习了模板引擎的方法。不过有些小伙...
    99+
    2023-06-14
  • Bootstrap中table的使用方法
    这篇文章主要为大家展示了“Bootstrap中table的使用方法”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“Bootstrap中table的使用方法”这篇文...
    99+
    2024-04-02
  • bootstrap的使用方法
    Bootstrap是一个开源的前端框架,用于快速开发响应式网站和Web应用程序。以下是使用Bootstrap的一些基本方法:1. 下...
    99+
    2023-09-21
    bootstrap
  • flask中模板引擎的使用方法
    小编给大家分享一下flask中模板引擎的使用方法,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!在我们对flask的一些引擎使用时,就不得不提到其中的一个默认引擎了...
    99+
    2023-06-14
  • Bootstrap中分页组件的使用方法
    这篇文章主要介绍Bootstrap中分页组件的使用方法,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!概述在Bootstrap框架中提供了两种分页导航:☑   带页码的分页导航☑   带翻页的分页导...
    99+
    2023-06-14
  • Bootstrap中下拉菜单类的使用方法
    这篇文章主要介绍Bootstrap中下拉菜单类的使用方法,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!下拉菜单是一种非常常见的效果,用于展示可切换、有关联的一组链接,它可以节省网页排版空间,使网页布局简洁有序。Boo...
    99+
    2023-06-14
  • Bootstrap中信息提示框的使用方法
    小编给大家分享一下Bootstrap中信息提示框的使用方法,希望大家阅读完这篇文章之后都有所收获,下面让我们一起去探讨吧!提示框是一个比较常见的功能,一般来说是鼠标移动到特定元素上时,显示相关的提示语。基本用法Bootstrap框架中的提示...
    99+
    2023-06-14
  • bootstrap Table的使用方法总结
    本文为大家分享了bootstrap Table的使用方法,供大家参考,具体内容如下 官网资料 效果图: 案例: html <!-- 表格 --> <table...
    99+
    2024-04-02
  • bootstrap警告框的使用方法
    这篇文章给大家分享的是有关bootstrap警告框的使用方法的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。警告框将文本和一个可选择的按钮放在一起,就是一个警告框,使用警告框必须设置.alert,还有其他的类可供选...
    99+
    2023-06-14
  • Flask-SQLALchemy基本使用方法
    目录数据库基本操作将数据添加到会话中示例:在视图函数中定义模型类常用的SQLAlchemy查询过滤器常用的SQLAlchemy查询执行器创建表:删除表插入一条数据一次插入多条数据查询...
    99+
    2024-04-02
  • python中Flask Web 表单的使用方法介绍
    目录简介普通表单提交Flask-WTF基础使用Flask-WTF处理表单Flask消息闪现文件上传文件上传的另一种写法简介 表单的操作是Web程序开发中最核心的模块之一,绝大多数的动...
    99+
    2024-04-02
  • flask上使用websocket的方法示例
    目录Flask-SocketIO服务器端程序SocketIO客户端程序使用Flask-SocketsFlask-Sockets和Flask-SocketIO之间的主要区别在于前者仅仅...
    99+
    2024-04-02
  • Bootstrap Table使用方法详解
    Bootstrap Table 是一个功能强大的 jQuery 表格插件,可以实现表格的分页、排序、搜索等功能。下面详细介绍一下 Bootstrap Table 的使用方法。1. 引入必要的文件在使用 Bootstrap Table 之...
    99+
    2023-08-11
    使用方法
  • flask结合jinja2使用的方法是什么
    这篇“flask结合jinja2使用的方法是什么”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“flask结合jinja2使用...
    99+
    2023-07-05
  • Bootstrap中手风琴组件的使用方法是什么
    这篇文章主要介绍“Bootstrap中手风琴组件的使用方法是什么”,在日常操作中,相信很多人在Bootstrap中手风琴组件的使用方法是什么问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望...
    99+
    2024-04-02
  • Bootstrap中警告框组件的使用方法是什么
    本篇内容介绍了“Bootstrap中警告框组件的使用方法是什么”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成...
    99+
    2024-04-02
  • 提升Flask应用性能的方法:使用Gunicorn
    Gunicorn如何提高Flask应用的性能? 随着互联网的快速发展,Web应用程序的性能对于用户体验和企业竞争力变得越来越重要。在处理高并发请求时,Flask框架默认的开发服务器往往无法满足需求。因此,我们需要使用Gunico...
    99+
    2024-01-17
    Flask gunicorn 性能提高
  • Bootstrap模态框的使用方法是什么
    本篇内容介绍了“Bootstrap模态框的使用方法是什么”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!在本...
    99+
    2024-04-02
  • 详解Flask框架中Flask-Login模块的使用
    目录flask-login 模块简介Flask-Login 模块的上手细节user_loader 函数login_user 函数logout_user 函数confirm_login...
    99+
    2023-01-13
    Python Flask框架Flask-Login使用 Python Flask Flask-Login Flask Flask-Login
  • Bootstrap中Table的使用示例
    这篇文章将为大家详细讲解有关Bootstrap中Table的使用示例,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。一、Bootstrap Table相关整理基于 Boot...
    99+
    2024-04-02
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作