Создание тени у текста

Чтобы сделать Web-страницы стильными, мы можем создать тень у текста некоторых ее элементов. (Но не для всех — во всем нужна мера.) Для этого служит атрибут стиля text-shadow, формат написания которого приведен далее.

text-shadow: none | <цвет> <горизонтальное смещение> <вертикальное смещение> [<радиус размытия>]

Значение none (установленное по умолчанию) убирает тень у текста. Цвет тени задается в виде RGB-кода.

Горизонтальное смещение тени задается в любой единице измерения, поддерживаемой CSS (см. табл. 10.1). Если задано положительное смещение, тень будет расположена правее текста, если отрицательное — левее. Можно также задать и нулевое смещение; тогда тень будет располагаться прямо под текстом. Нулевое смещение имеет смысл только в том случае, если для тени задано размытие.

Вертикальное смещение тени также задается в любой единице измерения, поддерживаемой CSS. Если задано положительное смещение, тень будет расположена ниже текста, если отрицательное — выше. Можно также задать и нулевое смещение — тогда тень будет располагаться прямо под текстом; делать это следует опять же в случае, если для тени указано размытие.

Радиус размытия тени также задается в любой единице измерения, поддерживаемой CSS. Если радиус размытия не указан, его значение предполагается равным нулю; в таком случае тень не будет иметь эффекта размытия.

Пример:

H1 { text-shadow: black 1mm 1mm 1px }

Здесь мы задали для заголовков первого уровня (тега <H1>) тень, расположенную правее и ниже текста на 1 мм и имеющую радиус размытия 1 пиксел.

ВНИМАНИЕ!

Атрибут стиля text-shadow и, соответственно, вывод тени не поддерживается Internet Explorer.