Python Flask框架 -- 加载静态文件

news2024/9/20 8:57:02

在项目中,一般都会把静态文件放在 static 目录下,如 images、css、js 等,html 放在 templates 目录下。

.py:

from flask import Flask, render_template

app = Flask(__name__)

@app.route('/static')
def static_demo():
    return render_template('static.html')

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

在各级对应的目录下创建:

 

static.html :

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="{{ url_for('static',filename='css/style.css') }}"> <!-- 加载css样式 -->
    <!--
    在模版文件中,通过 url_for 加载静态文件,第一个参数 static 是固定的,表示 Flask 内置的 static 视图这个 url ,
    第二个 filename 是传递文件名或者文件路径,路径是相对于 static 的
     -->
    <script src="{{ url_for('static',filename='js/my.js') }}"></script>  <!-- 加载js -->
</head>
<body>
<img src="{{ url_for('static',filename='images/ggbond.png') }}" alt="">
</body>
</html>

style.css :

body{
    background-color: pink;
}

my.js :

alert('我是my.js中执行的');

 

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1537496.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

初识C++(一)

目录 一、什么是C 二、关键字&#xff1a; 三、命名空间 &#xff1a; 1. C语言存在的问题&#xff1a; 2. namespace关键字&#xff1a; 3. 注意点&#xff1a; 4.使用命名空间分为三种&#xff1a; 四、输入输出&#xff1a; 五、缺省函数&#xff1a; 1. 什么是缺省…

2024年【山东省安全员C证】考试试卷及山东省安全员C证复审模拟考试

题库来源&#xff1a;安全生产模拟考试一点通公众号小程序 山东省安全员C证考试试卷是安全生产模拟考试一点通生成的&#xff0c;山东省安全员C证证模拟考试题库是根据山东省安全员C证最新版教材汇编出山东省安全员C证仿真模拟考试。2024年【山东省安全员C证】考试试卷及山东省…

《妈妈是什么》笔记(二) 让孩子自己做选择

经典摘录 孩子也会需要独立的空间做事情&#xff0c;求独立、求空间、求私隐 对于不管因为什么&#xff0c;别人在受到肯定和赞赏的时候&#xff0c;会对我们自己的心理带来因“比较”而产生的不适感甚至嫉妒感&#xff0c;进而在行为上影响了我们自己的节奏&#xff0c;产生一…

STL 容器元素减少但内存没有下降且不会自动释放,如何在运行时释放多余内存?【C++】

STL 容器元素减少但内存没有下降且不会自动释放&#xff0c;如何释放多余内存&#xff1f; 前言利用 swap 和匿名对象的性质进行收缩内存 前言 C程序里面我们经常会用到STL容器&#xff0c;容器在运行过程中可能会增长&#xff0c;导致它们分配的内存比实际存储的元素所需的内…

Linux源码包安装

目录 一、transmission源码包安装 二、 nginx源码包安装 一、transmission源码包安装 1、下载编译环境所需的软件包依赖 2、下载transmision源码包到用户主目录下 https://github.com/transmission/transmission/releases/download/4.0.5/transmission-4.0.5.tar.xz 3、解压…

python第三次项目作业

打印课堂上图案 判断一个数是否是质数&#xff08;素数&#xff09; 设计一个程序&#xff0c;完成(英雄)商品的购买&#xff08;界面就是第一天打印的界面&#xff09; 展示商品信息(折扣)->输入商品价格->输入购买数量->提示付款 输入付款金额->打印购买小票&a…

java 调用window操作系统文本转语音并生成播放文件

一、完整资源直接看这里&#xff1a; java调用window操作系统文本转语音并生成播放文件资源-CSDN文库 二、所需材料 材料一&#xff1a;最关键的&#xff0c;需要引用jacob包&#xff1a; <?xml version"1.0" encoding"UTF-8"?> <project x…

Vue2(七):超详细vue开发环境搭建(win7),nodejs下载与安装,安装淘宝镜像(报错已解决),配置脚手架

一、安装node.js 本来想粗略写一下的&#xff0c;但是搭建脚手架的时候&#xff0c;遇到了很多问题&#xff0c;浪费快两天时间&#xff0c;记录一下自己的解决办法希望对你们有帮助&#xff01; 1.下载nodejs 安装包下载链接【CNPM Binaries Mirror】 下载我划线的这个&am…

Linux(openEuler)部署SpringBoot前后端分离项目(Nginx负载均衡)

假如数据库在本地&#xff0c;没有放在Linux中 1.先把数据库中root的主机改成% 2.项目中的数据库链接配置换成本机ip 3.打包 4.把打包好的jar包放到Linux中 一般把jar包放到opt下 5.把前端部分拷贝到Linux的nginx中 5.1在package.json中修改build的值为图中这样 5.2同时由于在…

外包干了10天,技术倒退明显

先说情况&#xff0c;大专毕业&#xff0c;18年通过校招进入湖南某软件公司&#xff0c;干了接近6年的功能测试&#xff0c;今年年初&#xff0c;感觉自己不能够在这样下去了&#xff0c;长时间呆在一个舒适的环境会让一个人堕落!而我已经在一个企业干了四年的功能测试&#xf…

SpringMVC 简介及入门级的快速搭建详细步骤

MVC 回顾 MVC&#xff0c;即Model-View-Controller&#xff08;模型-视图-控制器&#xff09;设计模式&#xff0c;是一种广泛应用于软件工程中&#xff0c;特别是Web应用开发中的架构模式。它将应用程序分为三个核心组件&#xff1a; Model&#xff08;模型&#xff09;&#…

经纪人资格认证考试资料

一、名词&#xff1a; 1. 自然人、个体工商户、演出经纪人、演出经纪单位、演出市场主体、演出市场客体、 2. 营业执照、行政许可证 3. 居间、代理、行纪&#xff1a;演出经纪机构、个体经纪人分别有哪些权限&#xff1f; 4. 自行举办&#xff1a;文艺表演团体、个体演员&am…

Shell脚本学习-if循环

最小化的if语句 无实际用途 if [ ] ;then echo fi 脚本解释 if 判断 [ ] 里面的条件是否成立 后面跟then&#xff0c;代表条件成立 如果在一行则使用分号隔离&#xff08;;&#xff09; 如果不在一行使用则直接在下一行驶入then即可。 如果条件成立则输出echo 后面…

罐头鱼AI视频矩阵运营获客系统|视频批量混剪

智能化运营&#xff0c;助力视频营销——AI视频矩阵运营系统全面解析 随着数字营销时代的到来&#xff0c;视频已成为各行业推广和营销的重要手段之一。为了更好地管理和发布视频内容&#xff0c;我们推出了全新的AI视频矩阵运营系统&#xff0c;集成了多项智能功能&#xff0c…

张桥社区组织“平安大讲堂”企业应急救护及消防主题培训

为进一步加强园区商户的平安生产意识&#xff0c;提升应急救护能力&#xff0c;在襄阳市民政局的指导和支持下&#xff0c;襄阳市和时代社会工作服务中心依托襄阳市“光明谷”社会组织助力共同缔造项目&#xff0c;联合樊城区红十字会、樊城区点爱志愿者协会在张桥社区“美世界…

第十二届蓝桥杯省赛CC++ 研究生组

十二届省赛题 第十二届蓝桥杯省赛C&C 研究生组-卡片 第十二届蓝桥杯省赛C&C 研究生组-直线 第十二届蓝桥杯省赛C&C 研究生组-货物摆放 第十二届蓝桥杯省赛C&C 研究生组-路径 第十二届蓝桥杯省赛C&C 研究生组-时间显示 第十二届蓝桥杯省赛C&C 研究生组…

Unity---Lua语言

Lua Binaries Download 13.2 逻辑热更新——Lua1-3_哔哩哔哩_bilibili nil表示空 只有false和nil为false&#xff0c;其他值都为true ..连接两个字符串

基于Springboot的疫情物资管理系统(有报告)。Javaee项目,springboot项目。

演示视频&#xff1a; 基于Springboot的疫情物资管理系统&#xff08;有报告&#xff09;。Javaee项目&#xff0c;springboot项目。 项目介绍&#xff1a; 采用M&#xff08;model&#xff09;V&#xff08;view&#xff09;C&#xff08;controller&#xff09;三层体系结构…

阿里云2核4G云服务器ECS和轻量应用服务器价格表

阿里云2核4G服务器租用优惠价格&#xff0c;轻量2核4G服务器165元一年、u1服务器2核4G5M带宽199元一年、云服务器e实例30元3个月&#xff0c;活动链接 aliyunfuwuqi.com/go/aliyun 活动链接如下图&#xff1a; 阿里云2核4G服务器优惠价格 轻量应用服务器2核2G4M带宽、60GB高效…

TikTok新号必须做的3件事

根据互联网安全公司Cloudflare的2023年互联网流量回顾&#xff0c;TikTok超过谷歌成为2023年最受欢迎的网站。这意味着现在有大量用户在使用TikTok&#xff0c;在TikTok平台上&#xff0c;你可能会突然出名&#xff0c;可能会突然让您的营销获得回报。 但如果你是刚加入TikTok用…