flask中的HTML模板上未加载图像
当我通过Flask加载这个HTML模板时，没有一个图像与它一起加载。命令行中显示的对图像的get请求返回404错误。但是，即使CSS文件存储在与图像相同的静态文件夹中，它们也可以正常加载。HTML文件和flask应用程序本身的代码都包含在下面。
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Léelo</title>
<link rel="stylesheet" href="/static/homepagestyle.css">
</head>
<img id="logo" src="/images/Léelo.png" alt="Léelo"><br>
<nav class="menu">
<ul>
<li><a href="home.html" target="blank">HOME</a></li>
<li><a href="libros.html" target="blank">LIBROS</a></li>
<li><a href="..." target="blank">LITERATURA</a></li>
<li><a href="..." target="blank">MARKET PLACE</a></li>
</ul>
</nav>
<p></p>
<body div style="background-image: url(images/background.png);">
<div class="container">
<section class="lead">
<h1>QUIÉNES SOMOS?</h1>
<p><strong>Lorem Ipsum.</strong> El libro empieza con nuestro narrador contando que cuando tenia solo 6
años, por algo que leyó en un libro, dibujó una boa comiéndose un elegante. Orgulloso de su dibujo,
decide enseñárselo a las personas mayores, pero éstas piensan que es un sombrero. Al no entender su
dibujó, ellos le dicen que deje de dibujar y mejor se dedique a las matemáticas o la gramática.
Desilusionado, sigue su consejo.</p><br>
<h1>CUÁL ES NUESTRA META?</h1>
<p>El libro empieza con nuestro narrador contando que cuando tenia solo 6 años, por algo que leyó en un
libro, dibujó una boa comiéndose un elegante. Orgulloso de su dibujo, decide enseñárselo a las personas
mayores, pero éstas piensan que es un sombrero. Al no entender su dibujó, ellos le dicen que deje de
dibujar y mejor se dedique a las matemáticas o la gramática. Desilusionado, sigue su consejo. </p>
</section>
<footer>
<p>Made by: Team Goat</p><br>
</footer>
</div>
<p></p>
</body>
</html>以下是python代码。
import os
import logging
from flask import Flask, render_template
from flask_caching import Cache
# Change the format of messages logged to Stackdriver
logging.basicConfig(format="%(message)s", level=logging.INFO)
config = {
"DEBUG": True, # some Flask specific configs
"CACHE_TYPE": "SimpleCache", # Flask-Caching related configs
"CACHE_DEFAULT_TIMEOUT": 300,
}
app = Flask(__name__)
app.config.from_mapping(config)
cache = Cache(app)
@app.route("/")
def home():
return render_template("home.html")
@app.route("/libros.html")
def homepage():
return render_template("libros.html")
@app.route("/cache")
@cache.cached(timeout=50)
def cachedpage():
return "Cached for 50 seconds"
if __name__ == "__main__":
app.run(debug=True, host="0.0.0.0", port=int(os.environ.get("PORT", 8080)))回答 2
Stack Overflow用户
发布于 2021-10-23 19:10:07
我认为您需要将代码更改为：
<img id="logo" src="/static/images/Léelo.png" alt="Léelo"><br>此外，body标记的语法也不正确( body标记中不应该有div，CSS中不应该缺少单引号)以及错误的路径：
<body style="background-image: url('/static/images/background.png');">Stack Overflow用户
发布于 2021-10-23 19:35:10
您忘记了在url前面加上/static。
另外，我建议您使用url_for链接到静态文件。所以你的图片标签应该是：
<img id="logo" src="{{url_for('static', filename='images/Léelo.png')}}" alt="Léelo"><br> `
你的body标签应该是：
<body style="background-image: url('{{url_for('static', filename='images/background.png')}}');">
您还可以将链接标记更改为：
<link rel="stylesheet" href="{{url_for('static', filename='images/homepagestyle.css')}}">
https://stackoverflow.com/questions/69691107
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号