Мастерская: декоративные элементы / Испытание: анонс поста [18/18]

Зарегистрируйтесь, чтобы проходить испытания

Регистрация займёт всего минуту и позволит сохранять прогресс обучения.

Вы можете зарегистрироваться с помощью своей эл. почты и пароля, либо с помощью

ВК ВКонтакте или FB Facebook

×

Испытание: анонс поста [18/18]

Финальное испытание достаточно сложное, поэтому HTML-разметку делать не придется. Но обилие множества декоративных элементов заставит вас попотеть.

Адреса картинок и подсказки есть в комментарии в CSS-коде. А вот используемые цвета:

  1. #ffffff
  2. #7f8c8d
  3. #2980b9
  4. #bdc3c7

Выполнить задание
HTML
<!DOCTYPE html> <html lang="ru"> <head> <meta charset="utf-8"> <title>Испытание: анонс поста</title> </head> <body> <div class="post"> <div class="post-title">Интенсив: программа</div> <div class="post-date">13.09</div> <div class="post-type"></div> <div class="post-author"> Автор: <a href="#">HTML Academy</a> </div> <div class="post-stats"> <div class="icon icon-tags"></div> <a href="#">интенсив</a>, <a href="#">программа</a> </div> <div class="post-stats"> <div class="icon icon-comments"></div> <a href="#">5</a> </div> <div class="post-text">Работа над интенсивом идёт полным ходом. Мы нашли крутых людей в команду и решили еще кучу задач. Но сегодня я подробнее расскажу о работе над программой интенсива.</div> </div> </body> </html>
CSS
html, body { margin: 0; padding: 0; } body { width: 280px; min-height: 250px; padding-top: 50px; padding-left: 10px; padding-right: 10px; font-size: 12px; font-family: "Arial", sans-serif; line-height: 1.2; color: #7f8c8d; background: #ecf0f1; } .post-stats .icon { width: 15px; height: 15px; } /* Все размеры, отступы, координаты, размеры шрифтов (не заданные в body) кратны 5 или 10. Ардеса картинок: /assets/course14/quotes.png /assets/course14/post-challenge.png Картинка "кавычки" выровнена по центру */
<HTML Academy>
?

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

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

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

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