Основна проблема полягає в тому, що якщо користувач клацне за межами вікна масштабування, масштаб буде заблоковано, і він не зможе збільшити або зменшити масштаб.
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
Вікно перегляду – це видима для користувача область веб-сторінки. Він залежить від пристрою, і на мобільному телефоні буде меншим, ніж на екрані комп’ютера.
Частина width=device-width встановлює ширину вікна перегляду відповідно до ширини пристрою (яка буде відрізнятися залежно від пристрою).
Частина initial-scale=1.0 встановлює початковий рівень масштабування, коли сторінка вперше завантажується браузером.
Частина maximum-scale=1.0 визначає, наскільки користувачеві дозволено збільшувати масштаб сторінки. Значення 1.0 означає, що масштабування заборонено.
Частина user-scalable=no вимикає будь-яке масштабування, яке може бути доступним за замовчуванням на деяких пристроях (наприклад, подвійне торкання для збільшення).
Як вимкнути масштабування на мобільній веб-сторінці
Щоб вимкнути масштабування мобільної веб-сторінки в HTML, скористайтеся таким кодом:
Це змусить сторінку відповідати ширині пристрою, на якому вона переглядається.
Вимкнути масштаб
Щоб зменшити масштаб у HTML, використовуйте властивість zoom. Наприклад:
збільшення: 1;
Вимкніть масштабування HTML
Масштабування HTML — це функція HTML, яка дозволяє веб-браузерам збільшувати або зменшувати розмір тексту та зображень, щоб зробити їх більш читабельними на менших або великих екранах. Цю функцію можна вимкнути в більшості браузерів, встановивши для властивості html-scaling значення «none».