Својство text-shadow

Својството text-shadow задава сенка на текстот. Како вредност, својството прифаќа 4 параметри, наведени преку празно место, или клучен збор none, кој целосно ја откажува сенката (ова е стандардната вредност).

Синтакса

cssселектор {
  text-shadow: поместување_по_x поместување_по_y замаглување боја;
}

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

Параметри

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

Поместувањата по оските и замаглувањето се задаваат во какви било единици за димензии, освен проценти.

Пример

Ајде да ја поместиме сенката надолу и налево и да додадеме малку замаглување:

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

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

Результат:

Пример . Остра сенка

А сега да направиме црвена сенка, да ја поместиме надолу и налево, но да го отстраниме замаглувањето - сенката ќе биде остра:

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

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

Результат:

Пример . Еднообразна сенка

Сега сенката не е поместена, но е додадено замаглување:

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

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

Результат:

Погледнете ги исто така

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