title: The way to use background-image in css files with Django
body: <p>I'd like to use an image file as a background-image on <code>Django</code>. But I do not know how.
  First, I read <a href="https://docs.djangoproject.com/en/1.10/intro/tutorial06/" rel="noreferrer">this</a> and tried to write like following this in a css file.</p>
  
  <pre><code>#third{
      background: url("img/sample.jpeg") 50% 0 no-repeat fixed;
      color: white;
      height: 650px;
      padding: 100px 0 0 0;   
  }
  </code></pre>
  
  <p>But this does not work.</p>
  
  <pre><code>{% load staticfiles %}
  #third{
      background: url({% static "img/sample.jpeg" %}) 50% 0 no-repeat fixed;
  }
  </code></pre>
  
  <p>and</p>
  
  <pre><code>#third{
      background: url("../img/sample.jpeg") 50% 0 no-repeat fixed;
  }
  </code></pre>
  
  <p>don't work, too. </p>
  
  <p>How do you usually write css file when you use background-image on css files? Would you please give me some advices?</p>
  
  <pre><code>C:\~~~~~~&gt; dir hello\static\img
  2016/09/28  19:56             2,123 logo.png
  2016/09/24  14:53           104,825 sample.jpeg
  
  
  C:\~~~~~~&gt; dir hello\static\css
  2016/09/29  20:27             1,577 site.css
  
  
  C:\~~~~~~&gt; more lemon\settings.py
  BASE_DIR = os.path.dirname(os.path.dirname(__file__))
  PROJECT_ROOT = os.path.dirname(os.path.abspath(__file__))
  STATIC_ROOT = os.path.join(PROJECT_ROOT, 'staticfiles')
  STATIC_URL = '/static/'
  STATICFILES_DIRS = (
      os.path.join(PROJECT_ROOT, 'static'),
  )
  
  
  C:\~~~~~~&gt; more hello\templates\base.html
  {% load staticfiles %}
  &lt;link rel="stylesheet" type="text/css" href="{% static "css/site.css" %}" /&gt;
  </code></pre>
  
  <p>Django version: 1.9.2</p>