Css ile Nesnelere Saydamlık Verme


Twitter'da Paylaş Favorilerime Ekle

Nesnelere Saydamlık Uygulama

Bir önceki konuda saydam-yarı saydam arkaplan rengi uygulamaktan bahsetmiştik. Bu sayfamızda ise nesnelere (resimlerin, metinlerin vb..) saydamlık uygulamaktan bahsedeceğiz.

Opacity özelliği kullanılarak istenilen html elemanlarının saydamlık değeri belirlenebilir. 0 ile 1 arasında bir değer verilerek nesnelerin ne kadar saydam görüneceği ayarlanır.

Bazı eski tarayıcılarda opacity yerine filter:alpha(opacity=?) şeklinde kullanmak gerekir. ? yerine 0 ile 100 arasında bir değer verilir.

css ile saydamlık verme

Yukarıdaki resmin opacity özelliği 0.3 iken üzerine gelindiğinde 1 yapılarak tam görünür olması sağlanmıştır.

.resim1{
opacity: 0.3;
filter:alpha(opacity=30);}
 
.resim1:hover{
opacity: 1;
filter:alpha(opacity=100);}

 

css saydamlık verme, resimlere saydamlık uygulama, üzerine gelinen resmin saydam olması, css opacity özelliği kullanılarak saydamlığın ayarlanması

KONU İLE İLGİLİ ÖRNEKLER

Bu konu ile ilgili örnek bulunmamaktadır.

YORUMLAR



CSS Dersine Ait Diğer Konular: