Question

Below is code for setting background cover, i want to set transparency of background cover, so that i can display some text over it. I got the solution as below, but its not working for me. I am not getting where am missing it.

 style="background: url(images/football_ground.jpg) no-repeat center center fixed;-webkit-         
     background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;-moz-opacity:.30; 
filter:alpha(opacity=30); 
-khtml-opacity: 0.3;  ">

Answer 1

At the moment, CSS does not allow for a change in the alpha value of a background image. There are a couple different options if you wish to work around this:

1. Simply save your background image as a transparent png of the appropriate opacity.
2. Make the background image it’s own absolutely positioned element within the relatively positioned parent container.

.

<div class="parent">
    <div class="background"></div>
    <div class="foreground">some text</div>
</div>