Background Image Transparency Using CSS
<div class="my-container">
<h1>Scotch Scotch Scotch</h1>
</div>
.my-container {
position: relative;
background: white;
overflow: hidden;
}
/* You could use :before - it doesn't really matter */
.my-container:after {
content: ' ';
display: block;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 1;
opacity: 0.6;
background-image: url('http://placekitten.com/1500/1000');
background-repeat: no-repeat;
background-position: 50% 0;
background-size: cover;
background-attachment: fixed;
}