title: How to fade the background-image to black with CSS?
body: <p>I want to have a background-image which is not repeated. When the image ends, it should softly fade to black.</p>
  
  <p>Here is an example of what I mean, it just misses the "soft fading". The image ends abrupt and there is black, I would like to have this transition more smooth. Is that possible?</p>
  
  <p>(image randomly taken from google)</p>
  
  <pre><code>body {
      background:url(http://www.stadtteilschule-oejendorf.de/Unterricht/files/stacks_image_2936.png) #000 no-repeat;
  }
  </code></pre>
  
  <p>Live-Demo: <a href="http://jsfiddle.net/sMc8a/" rel="noreferrer">http://jsfiddle.net/sMc8a/</a></p>