И только смартфоны разительно отличаются друг от друга если брать разные поколения. Давеча столкнулся с проблемой, что аппарат Samsung S9 – отказывался «подчиняться» настройкам мобильной версии, долго не мог понять «почему?» - выяснилось, что причина тому – его разрешение дисплея FullHD, ну т.е. ширина настолько большая, что он уже шагает вровень с FullHD мониторами, да да – прощайте козявки дисплеи на планшетах, устаревших мобильниках и 13-15 дюймовых мониторов. У меня ноутбук игровой и то не тянет, притом, что обошёлся мне, как два таких смартфона. Вот и гадай после этого, не лучше было бы взять старенький ноут и такой S9. Нет, конечно же не лучше, всё-таки ноутбук мне нужнее телефона.
Для начала вернусь к тому, что уже было описано касательно мобильной версии:
Мобильная версия, через «USER-AGENT»
JavaScript мобильная версия сайта
Далее по тексту будет ещё один не описанный ранее метод.
Bootstrap 3: спрятать блок на маленьких экранах
Собственно, речь пойдёт о CSS, хоть я в последнее время всё чаще с CSS ухожу в JavaScript, интересующий меня вопрос решился с помощью следующих элементов:
Мобильные устройства (<768px) — .visible-xs, .hidden-xs
Планшеты (768px — 992px) — .visible-sm, .hidden-sm
Десктопы (992px — 1200px) — .visible-md, .hidden-md
Большие экраны (>1200px) — .visible-lg, .hidden-lg
Очень полезно будет почитать ( вот это ).
На самом деле, думаю, это далеко не последний мой обзор на тему мобильных версий. Всё-таки близок уже тот день, когда ПК и ноутбуки уйдут в историю, а балом будут править совсем другие устройства.
