如何在 Flask 模板上设置背景图像？答案

【问题标题】：How to set background image on Flask Templates?如何在 Flask 模板上设置背景图像？
【发布时间】：2017-01-27 12:38:24
【问题描述】：

我的背景图片仅适用于具有@app.route('/') 的模板。

 <header class="intro-header" style="background-image: url('static/img/home.jpg')">

这在以下情况下非常有效：

@app.route('/')
def home():
    return render_template('post.html')

一切正常。我明白了：

127.0.0.1 - - [19/Sep/2016 21:07:11] "GET /static/img/home.jpg HTTP/1.1" 304

但是当我使用相同的模板时：

@app.route('/post/')
def post():
     return render_template('post.html')

我明白了：

127.0.0.1 - - [19/Sep/2016 21:15:23] "GET /post/static/img/home.jpg HTTP/1.1" 404 -

背景图片是空白的。

【问题讨论】：

【解决方案1】：

This is a simple problem can solved by Flask documentation

无论如何，你应该在你的模板中使用这样的东西：

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

但如果您不想使用 Flask 方法，请使用：

url('/static/img/home.jpg')

或为您的文件使用另一个 Web 服务器而不是烧瓶默认 Web 服务器，例如 Apache 并通过 http://yoursite/static/img/home.jpg 访问

【讨论】：

【解决方案2】：

部分 URL 被解释为相对于样式表的来源，而不是相对于文档 - w3 CSS

这意味着您需要稍微更改您的url()，以包括前导/。

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

【讨论】：

【解决方案3】：

4 年零 7 个月太晚了，但无论如何，以防万一有人需要帮助..

我发现烧瓶识别出我的 .jpg 图像位于“静态”中，因此添加“静态”，如“background-image: url('/static/img/home.jpg')”，添加“额外“ 静止的。什么对我有用，使用骨架方法，

背景图片：url('home.jpg');

简单而赤裸，像一具骷髅。

【讨论】：