html - 如果存在背景图片，请插入div

我有一个可能带有或不带有图像的对象。如果它确实有图像，我希望将该图像用作div的背景图像。如果没有图像，我不希望div显示。我正在使用django模板。这是我到目前为止尝试过的：

{% if post.image %}
    <div class="background"></div>
{% endif %}

CSS是：

.background{
  position: absolute;
  z-index: -1;
  background-image: url("{{ post.image.url }}");
  width: 100%;
  height: 400px;
}

图像存储在AWS S3中。发生的情况是，如果对象没有图像，则页面不会加载，并告诉我'image'属性没有与之关联的文件。我能做什么？

最佳答案

也向您的CSS添加验证，并仅在图像存在时才渲染图像：

.background{
  position: absolute;
  z-index: -1;
  {% if post.image %}background-image: url("{{ post.image.url }}");{% endif %}
  width: 100%;
  height: 400px;
}