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

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

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

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

项目目录:

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

本地部署

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

app.py
from flask import Flask, render_template

app = 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"/>

效果:

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/langs/869430.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-13
下一篇 2022-05-13

发表评论

登录后才能评论

评论列表(0条)

保存