Всем привет! Не совсем понимаю, как верстать адаптивные сайты. Адаптивный т.е. сайт будет подстраиваться по размер экрана. Для этого придется скрывать какие-нибудь элементы. Вот сверстал я фиксированный сайт. И теперь мне надо через media queries скрывать различные части сайта. Например, было на десктопной версии сайта три блока вряд шириной 300px, а на мобильной и планшетной версии я хочу, чтобы она были друг под другом. И в media queries я указываю у них width: 100%; и так с каждым элементом? На youtube одни уроки по адаптивной верстке через bootstrap, а я хочу через media queries. Кто-нибудь видел такие? И где можно сказать декстопную версию сайта и мобильную версию? А то во всех шаблонах идет только дектопная версия.
Надеюсь, вы меня поняли)
И в media queries я указываю у них width: 100%; и так с каждым элементом?
Угу
И где можно сказать декстопную версию сайта и мобильную версию? А то во всех шаблонах идет только дектопная версия.
сказать = скачать?
Развивайте свое воображение, тренируйтесь. Бывает просят адаптировать уже сверстанные десктопные сайты или экономили на дизайнере (ну или думали, что экономят ;) ) и надо приходится выступать и в роли дизайнера.
На youtube одни уроки по адаптивной верстке через bootstrap, а я хочу через media queries. Кто-нибудь видел такие?
Там вроде и показывать особо нечего.
В media пишется условие для которого нужно показывать свойства. Ширина, соотношение сторон, ретина.
Пишут либо интервалы (редко) либо в правильном порядке на повышение или на понижение (mobile first или degradation).
А то во всех шаблонах идет только дектопная версия.
Я больше скажу. В реальной практике очень часто тоже дают только десктопный макет и просят сделать его адаптивным (экономят на дизайнерских услугах). Так что учитесь сами адаптировать десктопные макеты.
А в остальном вы все правильно написали. Берем блок и медиазапросами подстраиваем его.
Средний
