Современная вёрстка сайтов
Научишься грамотно пользоваться CSS с новыми методами для создания адаптивных сайтов: clamp(), min(), max()
Кому подойдет интенсив:
Знает базу вёрстки сайтов
Если вы недавно изучили азы вёрстки и уже познакомились с темой создания адаптива, то вам точно понравится.
Хотел бы быть в курсе новинок
В последний год в CSS появилось много нового, поэтому лучше узнать об этом не только в теории, но и на практике
Хочет пополнить своё портфолио
Это возможность пополнить портфолио не только новой работой, но и показать, какие технологии были использованы.
Какие новинки CSS изучим на интенсиве:
Функция clamp()
Задаёт значение в диапазоне между указанными нижней и верхней границами.
Функция min()
Принимает одно или большее количество значений и возвращает наименьшее из них.
Функция max()
Принимает одно или большее количество значений и возвращает наибольшее из них.
Программа:
1. Знакомство с макетом
- Что нового появилось в Figma?
- Под какие экраны актуально готовить адаптив?
- Подготовка проекта к вёрстке
Дополнительно: Макет Figma
2. Верстаем шапку сайта
- Теория про clamp()
- Верстаем блок и делаем его адаптивным
Дополнительно: Конспект про clamp()
3. Верстаем 1-й блок
- Теория про min() и max()
- Верстаем блок и делаем его адаптивным
Дополнительно: Конспект про min() и max()
4. Верстаем 2-й блок
- Как верстать колонки текста без Media?
- Верстаем блок и делаем его адаптивным
5. Верстаем 3-й блок
- Как сохранить пропорции крупного заголовка?
- Как сохранить пропорции кнопки?
- Верстаем блок и делаем его адаптивным
6. Верстаем подвал сайта
- Можно ли грид и флексбокс менять без подключения медиа-запроса?
- Верстаем блок и делаем его адаптивным
7. Дипломная работа
- Предоставляем новый макет
- Описываем методы решения задачи
- Выполняете дипломную работу
Дополнительно: Шпаргалка с решением задачи и проверка работы от Анны Блок
Во время интенсива вы сверстаете 2 макета, на основе которых потренируетесь в современных методах верстки сайтов.
