Адаптация сайта под мобильные устройства за 30 минут // Адаптивная верстка // Медиа запросы css3

Последние 2 месяца я почти не отдыхал. Я готовил для Вас два пушечных интенсива.
Самое крутое они также будут входить в общую подписку от 3 мес.

А также это крутая возможность поддержать автора.

Сегодня мы полностью адаптируем сайт под мобильные устройства. На самом деле это очень просто. Приятного просмотра!

В этом ролике подробно рассказывается, что такое адаптивная верстка или адаптация сайта. Все это помогут нам сделать медиа запросы css3 (css media queries).

00:00 - Начало
01:15 - Базовая верстка
07:30 - Общие стили
23:00 - Адаптируем
36:00 - Что в итоге получилось?
---------------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------------------

[REDGroup]

Большое спасибо за просмотр! Последние 2 месяца я почти не отдыхал. Я готовил для Вас два пушечных интенсива.
Самое крутое они также будут входить в общую подписку от 3 мес. за 590 руб.
Скорее залетай, если хочешь научиться писать приложения на React, писать backend на Node.js или просто верстать сайты.


А также это крутая возможность поддержать автора.

[soeqoyr]

Очень круто сделал, в разы лучше чем каналы 100к+.
Удачи в продвижении канала!
p.s Очень редко пишу комменты, ну тут без вариантов.

[izukmzo]

Спасибо Вам! Очень наглядно и понятно объясняете!

[sony]

Парень огонь! Спасибо! я правда надеядась про медиа запросы картинок увидеть

[nikitaaponik]

большое спасибо за подробное объяснение, очень помогло при создании сайта!

[namem]

Приятное, доступное изложение информации и ее визуализация, благодарю!

[cmomoop]

Всё нормально, даже не заморачивайся. Главное: ты интересно рассказываешь, а кому надо досмотрят полностью.

[davidsuraganlive]

Спасибо большое. Понял логику адаптация

[ryvomnc]

Макс, видео хоть и старое, но очень классное)) спасибо за контент

[Markuvines]

Спасибо за видео. Такой вопрос. Если вёрстка где-то между этими брейкпоинтами всё же ломается, то просто добавляется промежуточный? Или промежуточные ширины отдельно оговариваются? Просто такое впечатление, что вёрстка должна выглядеть хорошо только на этих брейкпоинтах, а то, что между не важно, но это же не правильно.

[Artem-oeum]

ты еще забыл сказать что в хэдре над подключить эти медиа запросы командой (<meta name="viewport" content="width=device-width, initial-scale=1">)

[enered]

круто, очень полезно, выкладывай исходники пожалуйста! Однозначно лайк!

[DoX]

Хм, шёл узнать одно, а узнал ещё восемь. Спасибо большое.
Что касаемо SCSS, можно сделать видео на эту тему. Там есть что рассказать.(я у тебя вроде не увидел раздела по этому поводу.)
Лайк там, подписка и пошёл куда послали, по ссылкам снизу. Будем смотреть что там интересного для юных верстальщиков.

[sichen]

мне кажется я один не понял почему у него вся страница по центру выравнивается, он вроде никаких отступов не делал

[vbvjmob]

Подскажите пожалуйста, как можно исправить ошибку. Те стили css которые подключаю к экрану 321 применяются сразу ко всем экранам. А должен применить я к экрану от 331 до 480. Заранее спасибо

[wzqrkiv]

что бы сделать адаптацию сайта нужен бутстрап? другие говорят нужен флексбокс или не обязательно?

[evlrscc]

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

[MAREVICH]

Короче я понял, волшебной таблетки что бы по клику все адаптировалось нету....нужно самому все верстать😂😂

[Thomas-owtf]

Добрый день! Спасибо за видео, можете дать ссылку на адаптив гамбургера?

[mrleb]

Подскажите пожалуйста кто-нибудь, вот я делаю адаптацию и когда выставляю в просмотре кода 320px то у меня элемент который стоит 100% от родителя body но этот элемент не на весь экран. Что делать?