text-shadow Özelliği

text-shadow özelliği metne gölge verir. Değer olarak özellik, boşlukla ayrılan 4 parametreyi kabul eder veya gölgeyi tamamen iptal eden none anahtar kelimesini (bu varsayılan değerdir).

Sözdizimi

seçici {
	text-shadow: x_kayması y_kayması bulanıklık renk;
}

seçici {
	text-shadow: none;
}

Parametreler

Parametre	Açıklama
x kayması	Gölgenin X eksenindeki kaymasını belirler. Pozitif değer sağa kaydırır, negatif değer - sola.
y kayması	Gölgenin Y eksenindeki kaymasını belirler. Pozitif değer aşağı kaydırır, negatif değer - yukarı.
bulanıklık	Gölgenin bulanıklığını belirler. Değer ne kadar büyükse - gölge o kadar bulanık olur. İsteğe bağlı parametre. Belirtilmezse - gölge keskin olur.
renk	Gölgenin rengini renk birimlerinden herhangi biriyle belirler. İsteğe bağlı parametre. Belirtilmezse - gölgenin rengi metnin rengiyle aynı olur.

Eksenler boyunca kaymalar ve bulanıklık, yüzde birimleri dışında herhangi bir boyut birimi ile belirtilebilir.

Örnek

Gölgeyi aşağı ve sola kaydıralım ve biraz bulanıklık ekleyelim:

<div id="elem">
	Lorem ipsum dolor sit amet.
</div>

#elem {
	text-shadow: 5px 5px 3px black;
}

Örnek . Keskin Gölge

Şimdi gölgeyi kırmızı renk yapalım, aşağı ve sola kaydıralım, ancak bulanıklığı kaldıralım - gölge keskin olacak:

<div id="elem">
	Lorem ipsum dolor sit amet.
</div>

#elem {
	text-shadow: 10px 10px red;
}

Örnek . Düzgün Gölge

Şimdi gölge kaydırılmadı, ancak ona bulanıklık eklendi:

<div id="elem">
	Lorem ipsum dolor sit amet.
</div>

#elem {
	text-shadow: 0px 0px 3px black;
}

Ayrıca Bakınız

box-shadow özelliği,
kapsayıcıya gölge verir