Как правильно прописывать разрешения в DevTools?

Question

[Никита Савченко]

Народ, подскажите.
Я уже много времени не могу понять эту вещь.
Например, мы хотим увидеть как будет выглядеть сайт на смартфоне Huawei P30.
Гуглим разрешение.
Получаем ответ: 2340x1080. Прописываем в дев тулзах, и получается полнейший бред.
Проясните вещь мне эту вещь, пожалуйста.

Answer 1

[imko]

https://developer.mozilla.org/ru/docs/Glossary/Viewport

Comments

[Никита Савченко]

Пролистал, но ничего не понял :)

[Никита Савченко]

<meta name="viewport" content="width=device-width,initial-scale=1.0">

Сейчас у меня этот тег выглядит так.

[Никита Савченко]

Прочитал от начала до конца страницу, но все равно не прояснил эту вещь

[imko]

Никита Савченко, у твоего хуавея на один пиксель вьюпорта несколько пикселей реального разрешения приходится, все размеры на странице в пикселях вьюпорта

[imko]

Никита Савченко, соответственно у него размер экрана для браузера будет 360x780

[Никита Савченко]

imko, и как мне узнать, какое выставлять разрешение?

[Никита Савченко]

imko, хм, а вы как это узнали?

[Никита Савченко]

imko, как я понял, вы поделили на 3. Но на всех ли телефонах так?
Не всегда ведь 3 реальных пикселя в одном, я думаю

[imko]

Никита Савченко, не уверен насчет коэффициента, но все мобилы 350-450 примерно по итогу будут. ели важно конкретную модель просто гугли ее вьпорт

[Никита Савченко]

imko, Спасибо большое за то, что прояснили эту вещь!