Ширина мониторов и их брейкпоинты

@Freeze_Breeze · Регистрация: 12.01.2016

Студворк — интернет-сервис помощи студентам

Всем здрасте. Скажу сразу информации в сети много, но у каждого она своя и найти какой нибудь "идеал" скажем так... Не совсем то что мне нужно, а нужно следующее: каждый монитор складывается из ширины и высоты. Мне нужна только ширина, а именно определение ширины мобильных устройств, планшетов, мониторов, телевизоров. То есть ширина экранов начинается от 320px и заканчивается 7680px. Так вот, на расстоянии этого отрезка от 320 до 7680 нужно определить, где начинаются и заканчиваются мобильные устройства, планшеты, мониторы. Допустим от 320 до 640 это ширина мобильных устройств, от 640 до 1200 это планшеты и т.д. Ссылка на Вики.

@shvyrevvg · 09.12.2017, 14:34

Какой-то ерундой занимаетесь...

@Freeze_Breeze · 09.12.2017, 14:43 **[ТС]**

Почему?

@shvyrevvg · 09.12.2017, 15:27

А какой смысл во всем этом? Зачем?

@Freeze_Breeze · 09.12.2017, 15:34 **[ТС]**

Для медиа-запросов на одном ресурсе пишут 320/480/768/980/1200/1400/1600/1900, на другом ресурсе пишут 320/480/600/768/1024/1280/1366, везде пишут по разному, а какие правильней всего использовать брейкпоинты в меда-запросах так до сих пор и не определился.

@shvyrevvg · 09.12.2017, 15:39

Имхо все в дизайн упирается.

@Freeze_Breeze · 09.12.2017, 15:48 **[ТС]**

shvyrevvg, я сам себе дизайнер

Но хотелось бы более точнее знать, где граничат размеры мобильного, планшетного, PC мониторов(экранов) и тогда было бы на мой взгляд проще делать медиа-запросы, например: ширина мобильных устройств идет от 320px до 480px (на пример), и в связи с этим пишем медиа-запрос:

CSS
1
@media only screen and (min-width : 320px) and (max-width : 480px){ /* стили */}

. Вот зачем мне нужно знать, где граничат размеры экранов

@mrtoxas · 09.12.2017, 17:18

Freeze_Breeze, Не проще ли детектить устройство при помощи какого-то плагина, например - тыц

form_factor
May return any of these values: Desktop, App, Tablet, Smartphone, Feature Phone, Smart-TV, Robot, Other non-Mobile, Other Mobile

Если не можете решить, какие основные медиа-запросы использовать, подсмотрите у других, например, во фреймворках - bootstrap, foundation и т.п.

@Freeze_Breeze · 09.12.2017, 18:29 **[ТС]**

mrtoxas, на данный момент использую bootstrap`овские 1200/980/768/480/320, но как то все узко... А за WURFL спасибо, но я еще не настолько жесткий верстальщик

@AlexZaw · 09.12.2017, 18:40

Сейчас столько разных размеров что за всеми не угонишся, плюс плотность пикселей на устройстве...
Возьмите хотя бы вот этотhttps://mydevice.io/devices/ сайт с таблицей разрешений экрана...

используйте основные брейкпоинты, того же бутстрапа например.

@Freeze_Breeze · 09.12.2017, 18:45 **[ТС]**

AlexZaw, вот, спасибо. Примерно такую таблицу я и искал.

Новые блоги и статьи Все статьи Все блоги /
Блокировка документа от изменений, если он открыт у другого пользователя Maks 08.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа, разработанного в конфигурации КА2. Задача: запретить редактирование документа, если он открыт у другого пользователя. / / . . .	Система безопасности+живучести для сервера-слоя интернета (сети). Двойная привязка. Hrethgir 08.04.2026 Далее были размышления о системе безопасности. Сообщения с наклонным текстом - мои. А как нам будет можно проверить, что ссылка наша, а не подделана хулиганами, которая выбросит на другую ветку и. . .	Модель ЗдрввоСохранения 7: больше работников, больше ресурсов. anaschu 08.04.2026 работников и заданий может быть сколько угодно, но настроено всё так, что используется пока что только 20% kYBz3eJf3jQ	Дальние перспективы сервера - слоя сети с космологическим дизайном интефейса карты и логики. Hrethgir 07.04.2026 Дальнейшее ближайшее планирование вывело к размышлениям над дальними перспективами. И вот тут может быть даже будут нужны оценки специалистов, так как в дальних перспективах всё может очень сильно. . .
Горе от ума kumehtar 07.04.2026 Эта мне ментальная установка, что вот прямо сейчас, мол, мне для полного счастья не хватает (нужное вписать), и когда я этого достигну - тогда и полный кайф. Одна из самых сильных ловушек на пути. . . .	Использование значений реквизитов справочника в документе, с определенными условиями и правами Maks 07.04.2026 1. Контроль срока действия договора Алгоритм из решения ниже реализован на примере нетипового документа "ЗаявкаНаРаботу", разработанного в конфигурации КА2. Задача: уведомлять пользователя, если. . .	Доступность команды формы по условию Maks 07.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: сделать доступной кнопку (команда формы "ЗавершитьСписание") при. . .	Уведомление о неверно выбранном значении справочника Maks 06.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "НарядПутевка", разработанного в конфигурации КА2. Задача: уведомлять пользователя, если в документе выбран неверный склад. . .

@Freeze_Breeze 278 / 272 / 106 Регистрация: 12.01.2016 Сообщений: 1,666

	Ширина мониторов и их брейкпоинты 09.12.2017, 14:07. Показов 2250. Ответов 10 Метки нет (Все метки) Всем здрасте. Скажу сразу информации в сети много, но у каждого она своя и найти какой нибудь "идеал" скажем так... Не совсем то что мне нужно, а нужно следующее: каждый монитор складывается из ширины и высоты. Мне нужна только ширина, а именно определение ширины мобильных устройств, планшетов, мониторов, телевизоров. То есть ширина экранов начинается от 320px и заканчивается 7680px. Так вот, на расстоянии этого отрезка от 320 до 7680 нужно определить, где начинаются и заканчиваются мобильные устройства, планшеты, мониторы. Допустим от 320 до 640 это ширина мобильных устройств, от 640 до 1200 это планшеты и т.д. Ссылка на Вики. 0

@shvyrevvg 1786 / 1036 / 445 Регистрация: 12.05.2016 Сообщений: 2,550
	09.12.2017, 14:34
	Какой-то ерундой занимаетесь... 0

@Freeze_Breeze 278 / 272 / 106 Регистрация: 12.01.2016 Сообщений: 1,666
	09.12.2017, 14:43 [ТС]
	Почему? 0

@shvyrevvg 1786 / 1036 / 445 Регистрация: 12.05.2016 Сообщений: 2,550
	09.12.2017, 15:27
	А какой смысл во всем этом? Зачем? 0

@Freeze_Breeze 278 / 272 / 106 Регистрация: 12.01.2016 Сообщений: 1,666
	09.12.2017, 15:34 [ТС]
	Для медиа-запросов на одном ресурсе пишут 320/480/768/980/1200/1400/1600/1900, на другом ресурсе пишут 320/480/600/768/1024/1280/1366, везде пишут по разному, а какие правильней всего использовать брейкпоинты в меда-запросах так до сих пор и не определился. 0

@shvyrevvg 1786 / 1036 / 445 Регистрация: 12.05.2016 Сообщений: 2,550
	09.12.2017, 15:39
	Имхо все в дизайн упирается. 0

@Freeze_Breeze 278 / 272 / 106 Регистрация: 12.01.2016 Сообщений: 1,666
	09.12.2017, 18:29 [ТС]
	mrtoxas, на данный момент использую bootstrap`овские 1200/980/768/480/320, но как то все узко... А за WURFL спасибо, но я еще не настолько жесткий верстальщик 0

@AlexZaw Модератор 2381 / 1741 / 677 Регистрация: 07.08.2016 Сообщений: 4,096
	09.12.2017, 18:40
	Сейчас столько разных размеров что за всеми не угонишся, плюс плотность пикселей на устройстве... Возьмите хотя бы вот этотhttps://mydevice.io/devices/ сайт с таблицей разрешений экрана... используйте основные брейкпоинты, того же бутстрапа например. 2

@Freeze_Breeze 278 / 272 / 106 Регистрация: 12.01.2016 Сообщений: 1,666
	09.12.2017, 18:45 [ТС]
	AlexZaw, вот, спасибо. Примерно такую таблицу я и искал. 0