тк 3 июля праздник (в беларуси), буду не онлайн (по возможности буду отвечать)

Свойство 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,
    которое задает тень контейнеру