Merhaba Arkadaşlar ,En basit temaları bile etkili CSS kodları ile çok daha şık ve kullanım konusunda çok daha etkili kılabilmek mümkündür. Bunlardan birisi de CSS Opacity kodudur. Aslında bu kod popüler olarak birçok web sitesinde ve blog teması içerisinde kullanılıyor. Görsel bir dosya üzerinde fare yokken soluk bir halde kalıyor ve biz üzerine faremizle yaklaştığımızda tıklama yapmasak dahi görsel kendi rengine dönüyor. Bunun aslında teknik olarak pek büyük bir faydası yok gibi duruyor. Fakat kullanımı kolaylaştırma dediğimizde ve belirginliği arttırmak söz konusu olduğunda CSS Opacity kodu gerçekten harikalar yaratabiliyor.
Peki, CSS Opacity kodunu nasıl işleve sokabiliriz? Aslında oldukça basit. Hemen aşağıda yer alan kod ile dilediğiniz görsele Blogger içerisinde CSS Opacity efektini verebilirsiniz. Aşağıda yer alan kodun içerisinden "resimadresi.jpg" adresine istediğiniz görselin linkini vermeniz ve istediğiniz yere eklemeniz yeterli.
Biraz CSS üzerinde bilgiye de sahipseniz, bu kod ile hafif oynamalar yapabilirsiniz. Mesela temanızın görsel alanında kullanmayıp yazı içerisinde kullanacaksanız bu kodu ayrı bir CSS parametresi olarak atayabilir ve istediğiniz görsellerde otomatik olarak kullanması için CSS kodu ile bağlayabilirsiniz. Böylece web siteniz içerisindeki tüm görsellere Opacity kodunu uygulayabilirsiniz.
<img src="resimadresi.jpg" style="opacity:0.4;filter:alpha(opacity=40)" onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100" onmouseout="this.style.opacity=0.4;this.filters.alpha.opacity=40" />
No comments:
Post a Comment