Изменение непрозрачности фона, а не дочерних элементов

Question

Возможно ли изменить непрозрачность фонового изображения формы, но не поля внутри формы. CSS:

#myForm{ 
    background-image:url("images/Binary.jpg");  
    border:1px solid #080808; 
    box-shadow:#444444 0 0 1px inset; 
    margin:20px auto 20px 52%; 
    padding:20px; 
    width:484px; 
    -moz-box-shadow:black 4px 5px 11px; 
    -webkit-box-shadow:black 4px 5px 11px; 
    box-shadow:black 4px 5px 11px; 
} 

Итак, это мой CSS и я хочу, чтобы уменьшить непрозрачность Binary.jpg только не содержимое формы. Является ли это возможным??

Answer 1

Ну, я взломал его, поэтому, конечно, вы можете сделать это, если хотите

Demo

HTML

<div class="wrapper"> 
    <div class="holder">This is awesome yea ;)</div> 
</div> 

CSS

.wrapper { 
    position: relative; 
    color: #fff; 
} 

.wrapper:before { 
    content: ""; 
    position: absolute; 
    z-index: 1; 
    top: 0; 
    bottom: 0; 
    left: 0; 
    right: 0; 
    background-image: url('http://www.freegreatpicture.com/files/146/25234-colorful-high-resolution-background.jpg'); 
    opacity: 0.7; 
} 

.holder { 
    z-index: 2; 
    position: relative; 
} 

Answer 2

Проще говоря: нет. Вам нужно будет сделать изображение полупрозрачным PNG.

Answer 3

вы можете сделать это с меньшей непрозрачностью фоном изменения изображения на парении с меньшим opecativy GIF или PNG изображением

или попробовать что-то подобное может работать

<div id="myForm"> 
    <form>...</form> 
</div> 

CSS

div { 
-khtml-opacity:.50; 
-moz-opacity:.50; 
-ms-filter:"alpha(opacity=50)"; 
    filter:alpha(opacity=50); 
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0.5); 
    opacity:.50; 
}