title: CSS Transparent Text with Solid Background Surrounding Text
body: <p>I am searching for a pure CSS method for creating transparent text within a box(div,p,etc) where the box is filled with a color surrounding the text, but not the text itself (which would be transparent a la rgba/hsla).</p>
  
  <p>Imagine a div styled in such a way that the text color within is rgba .2 alpha lvl, and the background color is solid, where the background solid color cannot be seen in the text.  Of course, a solution using multiple stacked divs/blocks would be greatly acceptable, but should allow for a hover state, so the effect can be switched on/off.  In using this, one could apply this div on top of an image or another div that can be seen through the letters.</p>
  
  <p>SO! CSS/html works in such a way that text is always applied on top of a background (called a background for a reason), so, using transparent colors on text color does nothing but show the color of the background.  I have tried creating a background with a big box shadow, in order to see if it's ever calculated differently, and it is not (and couldn't think of another method).</p>
  
  <p>Instead of blabbering on with my limited CSS knowledge, I think you get the point, so give me your best!  I want this to work in Chrome and Firefox at least.</p>
  
  <p><em>Stacked Overflow doesn't allow me to put a jsfiddle without accompanied code, and I don't want to put pointless code here just to link to a 'starting point' code.</em>
  Instead, here's an image explaining the obvious idea:</p>
  
  <p><img src="https://i.stack.imgur.com/5ului.jpg" alt="*made in ps"></p>