Herkese merhabalar arkadaşlar.Bu yazımızda sizlere Css ile resimlere saydamlık yani opaklık vermeyi göstereceğiz.
Css ile resimlere veya şekillere opaklık vermek oldukça basittir.”opacity: 0.4;” kodu ile resimleri saydam yapabiliyoruz.Hemen bir örnekle konuya açıklık getirelim.
Öncelikle saydamlık yapmadan önceki resmi paylaşalım.
Yukarıda gördüğünüz resim normal bir resimdir.Yani opaklık yapılmamış bir resimdir.Şimdi aşağıdaki kodları kullanarak resmimizi saydam yapıyoruz.
Html Kodu;
|
1 |
<div id="resim"> <img src="resim.jpg" /> </div> |
Css Kodu;
|
1 |
#resim{opacity: 0.4;} |
Şimdi kodlarımızın ekran görüntüsüne bakıyoruz.
Gördüğünüz gibi css ile “opacity: 0.4;” kodunu kullandık ve resmimizi saydam yaptık.Siz buradaki değeri istediğiniz gibi değiştirebilirsiniz.
Eğer “opacity:0;” yaparsanız resim görünmez yani tamamen saydam olur bu da resmin görünmemesine yol açar.Eğer “opacity:1;” yaparsanız da resim normal halini alır.Yani burada resmi saydam yapmak için 0 ile 1 arasında değerler vermeniz gerekiyor.
Umarız faydalı olur.Herkese iyi çalışmalar dileriz…
Bu Yazıya Tepkin Ne Oldu ?
Beğendim
Efsane
Teşekkürler
İyiymiş
Hahaha !
İnanılmaz
İlginç
Hatalı
