css3の浮動要素に背景を置き、不透明度を変更するにはどうすればよいですか？

Question

私はスタイルフォルダにいくつかの画像があるので、表示されない他の画像は無視してください。浮動小数点のleftparaとjoinbutton（ボタンではないパラグラフですが）は背景が白で、不透明度は.4にしたいと思います。

#stuff:before{ 
    display: block; content:""; position: absolute; z-index:-1; 
    background: url(blah.jpg); 
    opacity:.3; 
    top:10%; left: 0; right: 0; 
    height: 50%; 
} 

fiddle

Answer 1

あなたはこのコードを試すことができます。

hsla(0,0%,100%,0.70)またはあなたが望む外観を得るために何パーセントの飽和または不透明で白い背景を使用するRGBAと。 とあなたはあなたの質問は少しあいまいです不透明

background-attachment: fixed; 
background-image: url(blah.jpg); 
display: block; 
position: absolute; 
left: 0; 
top: 0; 
width: 100%; 
height: 100%; 
z-index: 1; 
background-color: hsla(0,0%,100%,0.70); 
background-blend-mode: overlay; 
background-repeat: no-repeat; 
filter: alpha(opacity=50); 

Answer 2

を取得するためにfilter: alpha(opacity=50);を使用することができ、しかし、次のコードは、「CSS3で浮動要素の背景を適用し、その不透明度を変える？

div{ 
 
    float: right; 
 
    display:block; 
 
    width: 350px; 
 
    height: 150px; 
 
    background-image: url(http://placehold.it/350x150/ff0000/ffffff); 
 
    opacity: 0.5; 
 
}

<div></div>