如何在我的django项目中的jumbotron背景中加载图像？

问题描述

我已经在这个问题上停留了很长时间了。我正在Django中做一个项目，我需要在大屏幕显示器的背景中放置一个图像。

home.html

 {% extends 'blog/base.html' %}
    {% load static %}
    {% block content %}
    <header>
      <style>
        .jumbotron {
        background-image: url('{{STATIC_URL}}blog/home-bg.jpg');
        background-size: cover;
      }
      </style>
    </header>
    <!-- JUMBOTRON -->
    <div class="jumbotron text-center">
      <div class="container">
        <h1>Welcome To CodeBlog</h1>  
        <p>Lorem ipsum dolor sit amet,consectetur adipisicing elit,sed do eiusmod tempor</p>
        <a href="{% url 'blog-about' %}" class="btn btn-primary">Read More</a>
      </div>
    </div>
    //some more lines of code
    {% endblock %}

home-bg.jpg存在于static / blog / home-bg.jpg

settings.py

STATIC_URL = '/static/'

但是，我仍然没有得到预期的结果。我正在使用Bootstrap4和Django 2.2

解决方法

{
    background: url("/static/img/sample.jpeg") 50% 0 no-repeat fixed;     
}

像这样使用。它会起作用。