CSS referanslarında görüntü saydamlığının nasıl ayarlanacağını ve arka plan görüntüsünün nasıl ayarlanacağını görebiliyorum. Ancak şeffaf bir arka plan resmi ayarlamak için bu ikisini nasıl birleştirebilirim?
Arka plan olarak kullanmak istediğim bir resim var, ancak çok parlak - opaklığı yaklaşık 0,2'ye düşürmek istiyorum. Bunu nasıl yapabilirim?
#main {
background-image: url(/wp-content/uploads/2010/11/tandem.jpg);
}
#main {
position: relative;
}
#main:after {
content : "";
display: block;
position: absolute;
top: 0;
left: 0;
background-image: url(/wp-content/uploads/2010/11/tandem.jpg);
width: 100%;
height: 100%;
opacity : 0.2;
z-index: -1;
}
İki yöntem:
#main
den önce position: absolute;
olan ve #main
ile aynı yükseklikte olan bir <div>
ye sahip olun, ardından background-image ve opacity: 0.2; filter: alpha(opacity=20);
uygulayın.Yalnızca arka plan saydamlığı yapmanın tek CSS yolu RGBa
kullanmaktır, ancak bir resim kullanmak istediğiniz için Photoshop veya Gimp kullanarak resmi saydam hale getirmenizi ve ardından arka plan olarak kullanmanızı öneririm.