text-shadow nedir? nasıl kullanılır ?

Merhaba arkadaşlar şu(goo.gl/TODWb) anket sonuçlarına göre en çok talep göre konu CSS3, şuan anlatacağım konu css2’de gelip 2.1 de kaldırılıp css3’de
tekrar gelmiştir. İlk makalemi kolay seçiyorum zamanla daha güzel daha işe yaracak ve anlaşılması zor css3 özelliklerinden bahsedeceğim.

text-shadow nedir ?

Metinlere bir veya birden farklı gölge verir.

Tüm tarayıcılar destekliyor mu ?

Modern tarayıcılar evet, IE problemleri için ise Fatih Hayrioğlunun bu özelliği eski ie alesinde nasıl çalıştıracağımızı anlatmış. (bkz: CSS ile metinlere gölge vermek)

text-shadow kullanımı :

p {text-shadow: Apx Bpx Cpx RENK;}

1	p {text-shadow: Apx Bpx Cpx RENK;}

Buradaki ;

“Apx” : Gölgenin soldan değeri
“Bpx” : Gölgenin sağdan değeri
“Cpx” : Gölgenin büyüklüğü

p.calisma1 {text-shadow: 2px 3px 4px #cd1821;}

1	p.calisma1 {text-shadow: 2px 3px 4px #cd1821;}

Bir metin’e birden fazla gölge verebiliriz.

p.calisma2{
padding: 40px 0 0 0;
text-shadow:
0 -35px 4px blue,
-250px 3px 4px green,
0 35px 4px black,
250px 3px 4px green;
}

p.calisma2{

padding: 40px 0 0 0;

text-shadow:

0 -35px 4px blue,

-250px 3px 4px green,

0 35px 4px black,

250px 3px 4px green;

}

</code><a href="http://codepen.io/AycanB/pen/rBKsw">Check out this Pen!</a>

1	</code><a href="http://codepen.io/AycanB/pen/rBKsw">Check out this Pen!</a>

Uygulama Ön izleme

Diğer kaynaklar :

Post Views: 2.620