How to make transparent background image
There is no have any background transparent css property, but you can do transparent background image with css trick, here have way using regular opacity and do transparent background image
Demo
Transparent background image
HTML
<div class="background-transparent"> <h2>Transparent background image</h2> </div>
CSS
<style> .background-transparent { width: 100%; height: 250px; display: block; position: relative; } .background-transparent::after { content: ''; display: block; position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: -1px; opacity: 0.5; background: url(img/test.jpg) no-repeat center center; background-size: cover; } .background-transparent h2 { text-align: center; font-size: 25px; line-height: 50px; font-weight: bold; color: #FFF; position: relative; z-index: 1; text-shadow: 1px 1px 0 rgba(0,0,0,0.5); } </style>