Настройте пользовательский интерфейс приложения Phonegap без target-densitydpi=device-dpi ⇐ CSS

[Anonymous]

Я создал приложение с помощью Phonegap для платформы Android.
Чтобы компенсировать различия в разрешениях устройств (dpi) и размерах экрана, размеры всех элементов пользовательского интерфейса указаны в единицах em. Затем я использую медиа-запросы CSS, чтобы установить другой базовый размер шрифта, используя -webkit-device-pixel-ratio.
Раньше все работало нормально и так, как и ожидалось, пока я не обнаружил, что target-densitydpi=device-dpi устарел в Webkit и поддержка будет удалена в будущем.
Вот мой метатег области просмотра перед удалением target-densitydpi:

Код: Выделить всё

Я обнаружил, что когда я удаляю target-densitydpi, приложение больше не выглядит так, как ожидалось, фактически размеры области просмотра резко уменьшаются. Вот скриншоты «до» и «после», сделанные на Xperia L (Android 4.1.2) с шириной 480 пикселей и window.devicePixelRatio 1,5:
перед удалением target-densitydpi :


после удаления target-densitydpi:


Приложение должно выглядеть как предыдущий снимок экрана без target-densitydpi, но я действительно не понимаю, как этого добиться? Потребуется ли переписывание значений CSS?
Есть ли способ обеспечить target-densitydpi=device-dpi без использования метатега?

Подробнее здесь: https://stackoverflow.com/questions/219 ... device-dpi