Оформление текста, часть 2 / Свойство text-shadow [2/26]
×

Свойство text-shadow [2/26]

Сначала познакомимся с текстовыми тенями.

Тени для текста создаются с помощью CSS-свойства text-shadow. Оно очень похоже на box-shadow, рассмотренное в одном из предыдущих курсов, но имеет свои особенности:

  • свойство text-shadow применяется к тексту;
  • форма тени повторяет форму текстовых символов;
  • можно управлять смещением тени, её цветом, а также размытием;
  • нельзя управлять растяжением текстовой тени;
  • можно создавать множественные тени.

Для начала давайте создадим тень у заголовка и смайлика, а потом рассмотрим все параметры свойства подробнее.


Выполнить задание
HTML
<!DOCTYPE html> <html lang="ru"> <head> <title>Свойство text-shadow</title> <meta charset="utf-8"> <base href="/assets/course79/"> </head> <body> <h1>В самолёте.<br>Летим в Мексику!</h1> <span>&#9787;</span> </body> </html>
CSS
body { font-family: "Arial", sans-serif; color: #ecf0f1; background: url("sky.jpg") no-repeat 0 0; } h1 { margin: 40px 40px 200px; font-size: 50px; font-weight: normal; } span { margin: 50px; font-size: 80px; }
HTML Academy

Пропишите свойство text-shadow со значением 30px 30px 1px #111111

  1. заголовку h1,
  2. смайлику span.
Теория Проверить Следующее задание
Идёт запись на курс Базовый HTML и CSS #16, который стартует 16 января.

Обсуждение и комментарии

Если у вас возникли сложности при прохождении задания, то вы можете обратиться за помощью на наш форум. Мы отслеживаем сообщения и постараемся ответить максимально быстро.

Пожалуйста, не пишите решение задач. Такие сообщения будут удаляться.

Перейти на форум или открыть комментарии.