Бесплатный видеокурс "Практика верстки сайта-лендинга с нуля до результата"
-
Автор(ы): Денис Булыга
В данном видеокурсе мы c нуля сверстаем PSD-макет, используя технологии HTML5 и CSS3, научимся вырезать изображения из макета. При верстке будет соблюдена структура проекта, используя для каждого блока отдельный файл со стилями. По результатам данного мини курса вы научитесь разделять проект на логические блоки, соблюдать его структуру, а также верстать несложные элементы используя HTML5, CSS3 и модуль Flexbox
- Урок 1. Создание проекта и нарезка PSD-макета в Photoshop
- Урок 2. Подготовка к верстке и создание HTML-структуры шапки сайта
- Урок 3. Написание CSS-стилей для шапки сайта
- Урок 4. Написание медиазапросов для шапки сайта
- Урок 5. Написание HTML-структуры для блока «About us»
- Урок 6. Полная стилизация блока «About us»
- Урок 7. Создание HTML-структуры для блока с иконками
- Урок 8. Полная стилизация блока иконок
В этом видеоуроке мы с чистого листа создадим структуру проекта, а также научимся вырезать изображения из PSD-макета в Photoshop. В данном уроке мы поговорим о том, каким образом будет устроен проект, какие файлы стилей понадобятся, а также создадим HTML-структуру для шапки сайта. В этом видео мы напишем необходимые CSS-стили для шапки сайта. В текущем уроке мы завершим верстку шапки сайта, адаптировав ее под различные разрешения при помощи медиазапросов. В этом видеоуроке будет создана HTML-структура для блока «About us». В данном уроке будет полностью сверстан, а также адаптирован под различные разрешения блок «About us». В этом уроке мы реализуем HTML-структуру для блока с иконками. Данный урок является заключительным. В нем мы полностью стилизуем и адаптируем блок с иконками, а также подведем итоги. |