Kimyazar - Ben yazarım! - Css efekt özellikleri

Css efekt özellikleri

CSS kullanarak kolaylıkla resimlerinize şeffaflık (transparanlık) özelliği verebilirsiniz.

Transparan Resim Yaratmak

CSS3'de yer alan opacity kodu resmin şeffaflık oranını ayarlamamızı sağlar:

img
{
/* Transparanlık oranı 40% */
opacity: 0.4;

/* IE8 ve aşağısındaki tarayıcılarda sorun çıkmaması için */
filter: alpha(opacity=40);
}

Yukarıda dikkat edildiyse iki kez 40% olduğunu belirttik. Birinci opacity kodumuz tüm güncel tarayıcılar için geçerli. Ancak bu kod Internet Explorer 8 ve aşağısında görüntülenmez. Bu sorunu düzeltmek için IE8 ve aşağı browserların anlayacağı tarz ikinci bir kod yazdık: filter: alpha(opacity=40); Buradaki 40, %40 ı ifade eder.

Fareyle Resmin Transparanlığını Değiştirmek

   img.stil { opacity: 0.5; filter: alpha(opacity=50); }

   img:hover.stil { opacity: 1.0; filter: alpha(opacity=100); }

Arkaplan Üzerinde Transparan Yazı

"Sevdiği kızı bırakıp gurbete gitmişti genç. Fakat aradan geçen yıllar sevgisinde hiç bir azalışa neden olmamıştı.Yıllar sonra döndügünde sevdiğinden şu sözleri işitti:"A gönlüme hükmeden. Bunca yıl geçti, yolunu gözledim. Ne bir haber, ne bir mektup?!. Meğer ne kadar vefasızmışsın?."

Bunun üzerine genç başını önüne eğdi, gözlerinden yaşlar akarken cevap verdi:" Ey sevgili! yüzünü görmek benim için uğruna ölünecek bir hasret iken, o şerefi postacıya mı bağışlasaydım?!"

Kaynaklar

Css.sitesi.web.tr

Ziyaretçi günlüğü

İp adresin: 3.141.32.252
Bugün ki ziyaretçi: 8
Bugün ki tıklanma:11
Toplam ziyaretçi: 3999
Toplam tıklanma:7284