无法在 css 中应用背景图像（烧瓶模板）

Question

我想在内部 css 中应用背景图片。我正在使用烧瓶模板。这是我的目录

src - templates - image - img.jpg
src- templates - upload.html

我想在upload.html 中应用背景图片。但我收到 404 错误。有人可以帮帮我吗？

我的代码：

background-image: url("/image/img.jpg");

错误信息：

获取 /image/img.jpg HTTP/1.1 404

Answer 1

可能存在多个问题，例如：

1. 不正确的目录 URL：尝试指定整个 URL - 而不是 "/image/img.jpg" 尝试 "/templates/image/img.jpg"。

2. 目录名称拼写错误 - 请正确检查。

3. 确保指定的图片格式正确 (.jpg)。

Answer 2

执行此操作的 (Flask) 标准方法（您将在示例和教程中看到）是将静态文件放在项目根目录的 static 文件夹中。假设你的 CSS 也在static，

background-image: url('/static/img.jpg');

做你想做的事。但是如果你在模板中嵌入样式，

background-image: url({{ url_for('static', filename='img.jpg') }});

是首选，虽然前者可以正常工作。

如果事情变得更加复杂并且您开始使用蓝图，请查阅文档。

Answer 3

我认为您提供了错误的路径，这就是您收到 404 错误的原因。您可以使用以下代码。

background-image: url{"image/img.jpg"};