用flask框架,在浏览器输出一个本地图片

编程入门 行业动态 更新时间:2024-10-13 12:17:00

用flask<a href=https://www.elefans.com/category/jswz/34/1770644.html style=框架,在浏览器输出一个本地图片"/>

用flask框架,在浏览器输出一个本地图片

用flask框架,在浏览器输出一个本地图片

新建flask项目

文件——>新建项目——>flask项目

项目目录:

flaskProject
|----static (新建flask项目时自动建的,没有任何文件)
|----templates(模板目录)
—index.html (前端页面)
|----venv(根)
|----app.py (flask项目启动文件)

本地部署

(没有服务器,本地运行)

app.py

from flask import Flask, render_templateapp = Flask(__name__)@app.route('/index')
def index():return render_template('index.html')if __name__ == '__main__':app.run()

index.html

    <html lang="en">
<head><meta charset="UTF-8"><title>显示一张图片</title>
</head>
<body><img src = "./static/99.png"/></body>
</html>

/static目录是要求目录,存放图片。跟着要求走,不然特容易入坑

右键run

路由为@app.route('/index')
访问:http://127.0.0.1:5000/index

图片绝对位移

在head中引入style结构

<style type="text/css">#tupian{position:absolute;left:500px;top:50px;}</style>

用position:absolute语句设置图片为绝对位移,用top和left调节位置
设置图片

<img src = "./static/456.png" width="556px" height="552px" id="tupian"/>

效果:

更多推荐

用flask框架,在浏览器输出一个本地图片

本文发布于:2024-03-14 18:07:45,感谢您对本站的认可!
本文链接:https://www.elefans.com/category/jswz/34/1737039.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:框架   浏览器   图片   flask

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!