How can one create an overlay in css?

Question

I\'d like to create a div with an arbitrary size, then display something on top of that div. What is the best way to position and size the overlay exactly as the div below i

Answer 1

         div{
         background-image:url('');
         background-size:cover;
         background-position:top center;
         position:relative;
         }

         div:before{
         content:'';
         position:absolute;
         left:0;
         top:0;
         height:100%;
         width:100%;
         background-color:rgba(0,0,0,0.7);
         }