Курс посвящён адаптивности — главному элементу сайта. Адаптивная вёрстка позволяет комфортно просматривать макеты на многих устройствах: мобильных телефонах, планшетах, компьютерных мониторах. В этом курсе раскроются механизмы создания адаптированной HTML-разметки с использованием популярных механизмов CSS. В конце курса вы узнаете об мощном инструменте — медиазапросах, с помощью которых возможно добавлять CSS-стили для разных разрешений и типов экрана.
Чему вы научитесь:
- Проверять адаптивность сайта используя онлайн-инструменты.
- Использовать единицу измерения проценты для создания гибких макетов.
- Работать с Flex при создании адаптивных макетов.
- Созданию медиазапросов, позволяющих использовать стили для разных разрешений экранов.
- Работать с различными типами устройств и создавать стили под них.
Подготовительный курс
CSS: FlexУроки курса
-
6
Медиазапросы
Познакомиться с одним из самых мощных инструментов для создания адаптивных сайтов — Media Queriesупражнение
-
7
Медиазапросы и другие устройства
Узнать о том, для каких устройств возможно применять свои стили.
Испытания
Это практические задания, которые мы советуем выполнить после завершения курса. Задания помогут вам получить дополнительный опыт в программировании и закрепить полученные навыки.
| # | Задание | % завершений |
|---|---|---|
| 1 | Меню «Гамбургер» | 59% |
Автор
Ключевые навыки: HTML, CSS, JS Frontend.
Много лет работал в аутсорсинговой компании. Развивал клиентские проекты, делал фичи для разных CMS. В основном верстал, готов передать весь опыт вам. Поработав с сотнями проектов, научился выкручиваться даже из самых безнадёжных ситуаций. Помогу освоить вёрстку, чтобы она перестала казаться чем-то страшным.
Впечатления
https://ru.hexlet.io/code_reviews/259320 автор снимаю шляпу перед твоим решением, 2 вечера придумывал, а оно вон как все оказывается было просто...
