<div class="container">
    <h1>Lorem ipsum dolor sit amet</h1>
  <img src="https://upload.wikimedia.org/wikipedia/commons/c/c5/Harrods_1909.jpg">
</div>
h1{
  position: absolute;
  top: 30%;
  background-color: rgba(255,255,255,0.5);
  width: 100%;
  text-align: center;  
}
.container{
  position: relative;
  max-width: 500px;
  margin: 0 auto;
}
img{
  width: 100%;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.