当html中图片无法显示且服务器返回404错误时，通常是因为图片路径未被web框架正确识别——关键在于静态资源（如.jpg）必须放在web框架指定的静态文件目录中，并通过正确的相对或绝对路径引用。
在Django、Flask等主流Python Web框架中，浏览器无法直接访问项目任意目录下的文件。即使你在Python脚本中能用open()成功读取öppettider.jpg，也不代表该文件可通过HTTP请求（如/öppettider.jpg）被访问。终端日志 "GET /öppettider.jpg HTTP/1.1" 404 明确表明：浏览器尝试向根路径请求该图片，但Web服务器未配置该路由或未将其视为静态资源。
✅ 正确做法（以常见框架为例）：
-
Django：
将图片放入 static/ 子目录（如 myapp/static/images/öppettider.jpg），并在HTML中使用 {% static %} 模板标签：{% load static %} <img src="{% static 'images/öppettider.jpg' %}" alt="Skövde Skatehall öppettider">并确保 settings.py 中已配置：
直播间话术巡检-windows下载直播话术巡检系统(Windows版) — 实时语音转写、关键词检测、场景自动切换、告警推送、大屏可视化。支持 Windows VB-Cable 虚拟声卡音频采集，阿里云 ASR 实时识别。一键启动脚本，自动安装环境。
STATIC_URL = '/static/' STATICFILES_DIRS = [BASE_DIR / "static"]
-
Flask：
默认将 static/ 目录作为静态资源根目录。把图片放在 static/öppettider.jpg，然后使用相对路径（注意：不是 ./öppettider.jpg，而是 /static/öppettider.jpg 或更推荐的 url_for）：<img src="{{ url_for('static', filename='öppettider.jpg') }}" alt="Skövde Skatehall öppettider">
⚠️ 注意事项：
立即学习“前端免费学习笔记（深入）”；
- ❌ 避免使用 src="öppettider.jpg"（无前缀）——这会让浏览器请求 http://localhost:8000/öppettider.jpg，而该路径未被映射到文件系统；
- ❌ 避免 src="./öppettider.jpg"——这是相对于当前HTML页面URL的路径，极易因路由嵌套出错；
- ✅ 始终通过框架提供的静态资源机制（{% static %} 或 url_for('static', ...)）生成路径，确保可移植性和安全性；
- ? 文件名含非ASCII字符（如 ö）一般可被支持，但建议重命名为 oppettider.jpg 并更新引用，避免潜在编码问题（尤其在旧版服务器或Windows环境下）。
总结：图片不显示的根本原因不是“路径写错”，而是未遵循Web框架的静态资源约定。将图片归入static/目录，并用框架推荐的方式引用，即可彻底解决404问题。
