CodePen

HTML

            
              <div class="image">Before</div>
<div class="image">
  <div class="color">
    After
  </div>
</div>
            
          
!

↑ Insert the most common viewport meta tag

CSS

            
              .image {
  background:url(http://nsood.in/logo256.png);
  width:256px;
  height:256px;
  display:inline-block;
}
.color {
  width:100%;
  height:100%;
  background-color:rgba(0,0,0,0.7);
  color:#fff;
}
            
          
!
? ?
? ?
Must be a valid URL.
+ add another resource
via CSS Lint

JS

            
              
            
          
!
Must be a valid URL.
+ add another resource
via JS Hint
Loading ..................