Как вернуть разрешение экрана 1920×1080 windows 10

Windows

Разрешение экрана в веб-дизайне

Мартин Михалек – 16 августа 2018 г.

Пожалуйста, поделитесь: Facebook

Разрешение экрана не очень интересно с точки зрения веб-разработчика, потому что мы отображаем веб-сайты и адаптируем их к размеру окна браузера. Однако иногда это бывает удобно, и у нас, конечно, есть возможность измерить разрешение.

Реклама

Книга «CSS: современная верстка» New

Попрощайтесь с плавающей запятой и начните делать макет современным способом. Подробнее →

Полезно ли это?

Как я уже упоминал, разрешение экрана не так интересно для веб-пользователей. Когда я спросил в Твиттере, нужна ли кому-то такая штука на практике, я получил лишь несколько примеров. В основном люди использовали его для идентификации пользователя:

Нам было все равно, какое разрешение экрана используют люди. Но они использовали разрешение js вместе с отпечатком браузера, чтобы распознавать разные устройства, которые один и тот же человек использовал для подключения к учетной записи. Таким образом, мы могли отслеживать его поведение на разных устройствах. А это уже было очень интересно.

…ну, а потом еще и по разным древним мракобесам:

Считаются ли взломы 20-летней давности (Netscape Navigator 4), когда мы отображали страницы в полноэкранном режиме, используя так называемое безхромное окно и расширяя его на весь экран?

Чтобы быть уверенным, я напоминаю вам, что разрешение экрана бесполезно в адаптивном дизайне. Вам всегда нужно знать размер окна, потому что это то, к чему должен адаптироваться веб-дизайн.

Читайте также:  Как вернуть размеры windows

Обнаружение с помощью JavaScript

Разрешение экрана

Находим разрешение экрана:

Будьте осторожны с этими значениями, они будут возвращать разные числа на разных устройствах. Например:

  • браузеры на iOS 9 и 10 всегда возвращают значения для более короткой стороны (портрет),
  • Android 4 возвращает аппаратное разрешение,
  • Edge 14 возвращает что-то вроде clientWidth иclientHeight только с размерами ползунка.

Доступное разрешение

Разрешение экрана доступное для окон приложений, обычно без основной панели операционной системы, можно узнать следующим образом:

На десктопе значения availWidth или availHeight обычно немного меньше, на мобильных телефонах обе категории – полное и доступное разрешение – имеют одинаковые значения.

Попробуйте на CodePen: cdpn.io/e/gjNpYg

Осторожно, все в пикселях CSS

Напоминаю, что вы получите все числа в пикселях CSS, а не в аппаратном разрешении. Если вам нужны аппаратные пиксели, вы должны умножить их на значение преобразования devicePixelRatio. Например:

Обнаружение в CSS

Media Queries предлагает запросы о ширине и высоте разрешения экрана — min-device-width и min-device-height .

Просто для протокола. Но в CSS это еще менее полезно, чем в JavaScript. Гораздо интереснее ориентироваться на размер окна.

Кроме того, во время написания статьи я узнал, что W3C собирается удалить эти функции из спецификации. Я полностью отождествляю себя с этим. Мой источник — Mozilla Developer Network.

Статистика разрешения экрана

В Интернете полно статистических данных о разрешении экрана. Например, на июль 2018 г. Gemius приводит следующий рейтинг:

Разрешение Пропорция
360 × 640 20,80%
1366 × 768 15,63%
1920 × 1080 13,47%
1280 × 1024 4,58%
1600 × 900 3,51%

Нельзя не заметить, что здесь отсутствует почти половина пользователей. Да, разрешений экрана сегодня действительно много и в краткую табличную сводку не влезешь.

Читайте также:  Как вернуть стандартную панель задач windows 7

Full HD, 2K, 4K и другие обозначения

Это часто является предметом обсуждения, так что вот онопо порядку упомяну аббревиатуры, используемые для обозначения некоторых резолюций:

Разрешение Сокращение
1024 × 768 XGA/XVGA
1280 × 720 HD
1920 × 1080 Full HD
2048 × 1080 2K
3840 × 2160 4K

Моим источником были Wikipedia и Mobilmania, где вы можете найти еще больше этих красивых аббревиатур.

Это также относится к разрешению видео или телевизорам, но это уже немного выходит за рамки нашей компетенции, если нас не интересуют HbbTV и смарт-телевизоры.

Это разрешение экрана. Гораздо интереснее наблюдать, как пользователи больших окон браузера получают доступ к вашим сайтам.

Поделиться с друзьями
ОС советы