Вопрос по заданию прозрачности фонового рисунка
 

Я знаю про такой способ реализации прозрачности фонового рисунка

<style>
div.div1{background: url(img/main.jpg); opacity: 0.5;}
</style>

Недостатком является то что прозрачность задается не толко для фонового рисунка но также и для текста помещенного в элемент


Есть еще такой способ, но не для фонового рисунка, а для фонового цвета

<style>
div.div1{background: rgba(255,255,170,0.5); /*цвет и прозрачность фона*/}
</style>

В этом случае прозрачность касается только фонового цвета и не касается текста помещенного в элемент.


Вопрос:
Нельзя ли задать прозрачность фонового рисунка таким образом что бы прозрачность касалась только фонового рисунка и не касалась текста помещенного в элемент?

сохранить картинку с прозрачностью не вариант?

shurik_shink,

<style>
.wrap{
  position:relative;
  width:400px;
  height:122px;
}
.psevdoBg {
  position:absolute;
  left:0;top:0;margin:0;
  opacity:0.5;
}
div.cnt {
  position:relative;z-index:1;
  width:100%;
  height:100%;
  margin:0;
  font: normal normal 700 16px/normal "Times New Roman";
  color:#fff;
  background: rgba(255,0,17,0.25);
}
</style>
<div class="wrap">
  <img class="psevdoBg" src="http://www.optimum1.ru/images/shapka2.jpg" width=100%/>
  <div class="cnt">
<br>
     aadasdasdad<br>
     aadasdasdad<br>
     aadasdasdad<br>
     aadasdasdad<br>
  </div>
</div><br>
<div class="wrap">
  <img class="psevdoBg" src="http://www.optimum1.ru/images/shapka2.jpg" width=100%/>
  <div class="cnt" style="background: transparent;">
<br>
     aadasdasdad<br>
     aadasdasdad<br>
     aadasdasdad<br>
     aadasdasdad<br>
  </div>
</div><br>
Ну а тут истинный вид картинки <br>
<img src="http://www.optimum1.ru/images/shapka2.jpg" width=400/>

Lemme, нет конечно, она тогда будет весить намного больше, так как png.