Разрешение моего мобильного телефона составляет 2960 пикселей × 1440 пикселей, а разрешение рабочего стола - 1366 x 768.Исходя из этого, мобильное разрешение больше настольного.При использовании медиазапросов мой мобильный должен отображать веб-сайт на рабочем столе, а не мобильный, поскольку разрешение мобильного телефона больше.Есть ли разница между мобильным разрешением и разрешением рабочего стола?На каком основании обрабатываются эти медиазапросы.
// Small devices (landscape phones, 576px and up)
@media (min-width: 576px) { ... }
// Medium devices (tablets, 768px and up)
@media (min-width: 768px) { ... }
// Large devices (desktops, 992px and up)
@media (min-width: 992px) { ... }
// Extra large devices (large desktops, 1200px and up)
@media (min-width: 1200px) { ... }
См. Ссылку ниже: https://codepen.io/TrentWalton/pen/kqxDy
Если я посмотрю ссылку по мобильному телефону, я смогу видеть поля один за другим, т.е.Оранжевый блок, затем в следующей строке синий блок, хотя мобильное разрешение больше.