Свойство text-shadow

Свойство text-shadow задава сянка на текста. Като стойност свойството приема 4 параметъра, изброени през интервал, или ключова дума none, която отменя сянката напълно (това е стойността по подразбиране).

Синтаксис

селектор {
	text-shadow: отместване_по_x отместване_по_y размазване цвят;
}

селектор {
	text-shadow: none;
}

Параметри

Параметър	Описание
отместване по x	Задава отместване на сянката по оста X. Положителна стойност отмества надясно, отрицателна - наляво.
отместване по y	Задава отместване на сянката по оста Y. Положителна стойност отмества надолу, отрицателна - нагоре.
размазване	Задава размазване на сянката. Колкото по-голяма е стойността - толкова по-размазана ще бъде сянката. Незадължителен параметър. Ако не е зададен - сянката ще бъде четка.
цвят	Задава цвят на сянката във всякакви единици за цвят. Незадължителен параметър. Ако не е зададен - цветът на сянката съвпада с цвета на текста.

Отместванията по осите и размазването се задават във всякакви единици за размери, с изключение на проценти.

Пример

Нека преместим сянката надолу и наляво и добавим леко размазване:

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

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

Пример . Четка сянка

А сега нека направим сянката червена, преместим я надолу и наляво, но премахнем размазването - сянката ще бъде четка:

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

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

Пример . Равномерна сянка

Сега сянката не е отместена, но към нея е добавено размазване:

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

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

Вижте също

свойство box-shadow,
което задава сянка на контейнер