Css Eğitimi Ders 14-Transparan

Merhaba,
Siteye güzel bir görüntü katan transparan resimler üzerinde bir konu işleyeceğiz. Bazı örnekler verip daha iyi anlamanızı sağlayacağım.

Transparan Nedir?

Transparan saydamlık anlamına gelir. Resim üzerinde kullanılır. 

Transparan

Transparanlık belirtmek için "opacity" kullanılır. 

img.transparanresim {

opacity: 0.6; 

filter: alpha(opacity=60); 

}

"opacity" ile 0.6 transparan oluşturduk. Ve bunu "filter" kullanarak tarayıcı uyumluluğuna bağladık. Bununla ilgili bir güzel örnek daha:

img.transparanresim {

opacity: 0.6; filter: alpha(opacity=60); 

} 

img:hover.transparanresim { 

opacity: 1.0; filter: alpha(opacity=100); 

}

Bu kodu bir resim üzerinde önizlerseniz (class adı transparan resim) resim transparan olup üstüne gelince 1 yani düz transparanlığa dönüşecektir. Eğer herhangi bir class oluşturmayıp kullansaydık ozaman bütün resimlerde bu css stili uygulanacaktır.