Flask之加载静态资源
Flask之加载静态资源
1.加载css样式
<link rel="stylesheet" href="{{ url_for('static',filename='css/img.css',_external=True) }}">
2.加载js脚本
<script rel="stylesheet" src="{{ url_for('static',filename='js/img.js') }}"></script>
3.加载图片
<img src="{{ url_for('static',filename='img/g2.jpg' )}}">
4.修改页面title位置的图标
<link rel="icon" type="image/x-icon" href="{{ url_for('static',filename='favicon.ico') }}" />
flask的静态文件,一般放在static目录下,前端页面放在templates下(而且这两个名字是flask框架内部定义的(static,templates)(也可以修改)),目录结构如图:

模板(index.html)里加载静态文件的路径也要改下,原模板路径如下:
<img src="img/6.jpg" alt="">
改为:
<img src="static/img/6.jpg" alt="">
css和js同理。
Flask之加载静态资源的更多相关文章
- flask模板应用-加载静态文件:添加Favicon,使用CSS框架,使用宏加载静态资源
加载静态文件 一个Web项目不仅需要HTML模板,还需要许多静态文件,比如CSS.JavaScript文件.图片和声音声.在flask程序中,默认需要将静态文件存储在与主脚本(包含程序实例的脚本)同级 ...
- Django的urls.py加载静态资源图片,TypeError: view must be a callable or a list/tuple in the case of include().
Django的urls.py加载静态资源图片,TypeError: view must be a callable or a list/tuple in the case of include(). ...
- Thymeleaf模板引擎绕过浏览器缓存加载静态资源js,css文件
浏览器会缓存相同文件名的css样式表或者javascript文件.这给我们调试带来了障碍,好多时候修改的代码不能在浏览器正确显示. 静态常见的加载代码如下: <link rel="st ...
- nginx反向代理部署springboot项目报404无法加载静态资源
问题:nginx反向代理部署springboot项目报404无法加载静态资源(css,js,jpg,png...) springboot默认启动端口为8080,如果需要通过域名(不加端口号)直接访问s ...
- 关于springboot2.*版本无法加载静态资源
前言 在学习springboot的过程中,发现无法引用静态资源.我使用的是springboot2.2.1版本. 追溯源码,终于解决.并记录下解决思路. 默认加载路径 首先得知道springboot默认 ...
- 页面性能优化:preload预加载静态资源
本文主要介绍preload的使用,以及与prefetch的区别.然后会聊聊浏览器的加载优先级. preload 提供了一种声明式的命令,让浏览器提前加载指定资源(加载后并不执行),在需要执行的时候再执 ...
- Spring 加载静态资源
<mvc:default-servlet-handler/> JSP 中通过标签加载js文件或者link标签加载css文件等静态资源时要在springmvc的xml文件中配置以上设置请求就 ...
- Tomcat 部署项目无法加载静态资源
首先,我的Eclipse是引用外部的Tomcat 引用外部Tomcat会在左侧生成一个Server文件夹,相当于复制了一份Tomcat到Eclipse的安装目录里 具体Tomcat所在目录可以在这进行 ...
- django模板加载静态资源
1. 目录结构 /mysite/setting.py部分配置: # Django settings for mysite project. import os.path TEMPLATE_DIRS = ...
随机推荐
- Flutter中的普通路由与命名路由(Navigator组件)
Flutter 中的路由通俗的讲就是页面跳转.在 Flutter 中通过 Navigator 组件管理路由导航.并提供了管理堆栈的方法.如:Navigator.push 和 Navigator.pop ...
- Linux学习笔记(九)shell基础:echo、命令别名和常用快捷键
一.echo在屏幕上打印内容 echo [选项] [输出内容] -e 支持转义字符控制的字符转换 输出带颜色的文本 二.第一个脚本 编写脚本 注意: #!/bin/bash 此行不是注释,必须有 #! ...
- 14_sqoop数据导入
3.Sqoop的数据导入 “导入工具”导入单个表从RDBMS到HDFS.表中的每一行被视为HDFS的记录.所有记录都存储为文本文件的文 本数据(或者Avro.sequence文件等二进制数据) 3.1 ...
- python3 基础三
一.if语句 if condition_1: statement_block_1 elif condition_2: statement_block_2 else: statement_block_3 ...
- 解决python中调用 imread 报错:ImportError: cannot import name imread
安装了scipy后,报cannot import name imread错误, 1.网上查阅资料后说是需要安装pillow,安装pillow之后,仍然报该错误, 2.网上说是pillow与SciPy安 ...
- C语言I 博客作业03
这个作业属于哪个课程 C语言程序设计II 这个作业要求在哪里 作业要求 我在这个课程的目标是 掌握关系运算.if-else语句.格式化输入语句scanf(),以及常用的数学库函数 这个作业在那个具体方 ...
- Java8-Executors-No.02
import java.util.concurrent.ExecutionException; import java.util.concurrent.ExecutorService; import ...
- Java8-Lambda-No.04
public class Lambda4 { static int outerStaticNum; int outerNum; void testScopes() { int num = 1; Lam ...
- Linux C打印所有的环境变量
#include <stdio.h> extern char** environ; int main() { ; ; environ[nIndex] != NULL; nIndex++) ...
- sql 查询 between and 和 >= <= 比较
好久没有更新博客了,积累了很多问题没有得到解决,自己也在纠结有些东西需不需要花时间研究一下,认真想了想,不管怎么样,不能停止更新博客,继续保持一周至少一篇的习惯,不能放弃. 今天说的问题比较简单,就是 ...