title: CSS background-image-opacity?
body: <p>Related to <a href="https://stackoverflow.com/questions/806000/css-semi-transparent-background-but-not-text">How do I give text or an image a transparent background using CSS?</a>, but slightly different.</p>
  
  <p>I'd like to know if it's possible to change the alpha value of a background <em>image</em>, rather than just the colour. Obviously I can just save the image with different alpha values, but I'd like to be able to adjust the alpha dynamically.</p>
  
  <p>So far the best I've got is:</p>
  
  <pre><code>&lt;div style="position: relative;"&gt;
      &lt;div style="position: absolute; left: 0px; right: 0px; top: 0px; bottom: 0px;
                        background-image: url(...); opacity: 0.5;"&gt;&lt;/div&gt;
      &lt;div style="position: relative; z-index: 1;"&gt;
          &lt;!-- Rest of content here --&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>It works, but it's bulky and ugly, and messes things up in more complicated layouts.</p>