Проблема с соотношением пикселей Android Phonegap - изображения, ненадежная ширина страницы

Question

Когда я ранее создавал приложение PhoneGap, изображения, отображаемые на страницах, некорректно отображаются на устройствах с высоким разрешением. Поэтому я сделал веб-страницу с фиксированным соотношением пикселей: 1 для всех устройств без учета DPI устройства. Но это снизит четкость изображений.

Я планировал использовать плавные стили для моего нового приложения и не использовать конкретные ширину и высоту в HTML. Но когда я указал высоту в пикселях для div (в CSS), высота отображается на разных устройствах по-разному.

Есть ли способ сделать соотношение HTML, а также ширину и высоту CSS одинаковыми?

Есть ли какое-либо неизвестное свойство, позволяющее HTML вести себя с разным соотношением пикселей.

Я использую тег HTML:

<meta name="viewport" id="viewport" content="width=device-width, target-densitydpi=device-dpi, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0" />

Я хотел бы визуализировать страницу в device-dpi, чтобы избежать снижения четкости. Пожалуйста, предоставьте ваши идеи.

Answer 1

В идеале вы должны избегать использования пикселей и использовать их. Например: вместо 16px используйте 1.1em или любой другой эквивалент для вашей ситуации. Это сработало для моих телефонных звонков jquerymobile приложений