Evet arkadaşlar , bir önce ki makalelerimde oval köşeli div modeli ve oluşturduğumuz div modeline gölge uygulamayı göstermiştim.Şimdi ise metinlerimize gölge efekti uygulamayı anlatmaya çalışacağım.Örnek bir resim göstermek gerekirse.

• Safari: 3.2+
• Firefox: 3.5+
• Chrome: 3.0+
• Opera: 10.1+
• Internet Explorer: Umarım çok yakında !

Kod kullanım örneği ise şu şekilde ;

1

text-shadow: offset_x offset_y blur_radius color;  /* X ve Y koordinatlarında değer belirliyoruz , bulanıklaştırma değeri atıyoruz.En son aşamada ise gölge rengini belirliyoruz. */

Örnek ;

1
2

color: #fff /* Normal , metin rengi. */
text-shadow: 0 0 50px #333;  /* x=0 , y=0 koordinatlarında 50px bulanıklaştırma değeriyle , #333 değerini atadık */

Evet işlemler çok hızlı gerçekleştirilebiliyor.Bir sonra ki makalemde görüşmek üzere.

Bir önceki makalemde , oval köşeli div modeli yapımını anlatmaya çalışmıştım.Şimdi ise Gölge efekti uygulamayarak ocal köşeli veya normal keskin köşeli dikdörtgen biçiminde ki div modelimize gölge efekti uygulayacağız.

Destekleyen Tarayıcılar ;

• Safari: 3.2+
• Firefox: 3.5+
• Chrome: 3.0+
• Opera: 10.5+
• Internet Explorer: 9.0+

IE her zaman ki gibi problemler çıkarmakta.Kullanım örneğine geçiş yapalım.

1
2
3

-webkit-box-shadow: offset_x offset_y blur_radius color;  /* Web-kit tekniği ile x ve y koordinatlarında değer atıyoruz , Blur değeri ile yumuşatma efekti veriyoruz . En son reng atıyoruz. */
-moz-box-shadow: offset_x offset_y blur_radius color;  /* Aynı açıklamalar , web - kit tekniğiyle aynıdır */
box-shadow: offset_x offset_y blur_radius color;  /* Aynı açıklamalar , web - kit tekniğiyle aynıdır */

Kod açıklama örneği bu şekilde , kullanım örneği göstermek gerekirse.

1
2
3

-webkit-box-shadow: 5px 5px 10px #555;
-moz-box-shadow: 5px 5px 10px #555;
box-shadow: 5px 5px 10px #555;

Evet herşey bu kadar basit ve kullanışlı . Bir sonraki makalem de görüşmek üzere , hoşçakalın.

Evet son günlerin popüler css işlemlerinden bahsetmek istiyorum sizlere.Kısaca betimlemek gerekirse , bir çok web sayfasında görmüşüzdür.Gölge kutuları , Oval köşeli div kalıplarını , gölgeleri yazıları ve flash kullanmadan yapılan glow efektlerini.Şimdi sizlere bunların nasıl yapıldığı hakkında bilgi vereceğim.

1.Oval Köşeli Div Modelleri

Evet bu uygulama için en başta hangi tarayıcılarda problemsiz çalıştığını bilmekte fayda var.

Tarayıcı Desteği ;

• Safari: 3.2+
• Firefox: 3.0+
• Chrome: 3.0+
• Opera: 10.5+
• Internet Explorer: 9.0+

Kullanım örneği için ;

-webkit-border-radius: size;   /* Web-kit tekniğiyle size boyutu veriyoruz . */
-moz-border-radius: size;   /* Web-kit tekniğinden öte , Mozilla firefox için bir söz dizimi yazdık */
border-radius: size;  /* Normal biçimde oval değer atamak için , söz dizimi yazdık */

Evet arkadaşlar sonuç olarak css dosyasımızı çok hızlı bir biçimde oluşturduk . Yapılacak en son işlem bir div id’si belirleyerek , bu css dosyasımıza bağlamak olacaktır.