Я пытаюсь получить отзывчивый веб-дизайн для своего приложения, чтобы он адаптировался к нескольким экранам. Следовательно, я использовал единицы просмотра (vw и vh) в моем CSS для каждой вещи от размера шрифта до поля. Но веб-просмотр cordova не поддерживает единицы просмотра. Я застрял здесь.
Есть ли способ обходного пути, чтобы заставить подразделения vh и vw работать на веб-сайте cordova? Или есть ли другой способ получить отзывчивый веб-дизайн для моего приложения, чтобы я мог его выпустить на нескольких экранах (Android).
заранее спасибо.
Я получил js обходной путь, он отлично работает в приложении cordova
код:
var w=$(window).width()/100; var h=$(window).height()/100; function vw( val ) { return w*val+'px'; } function vh( val ) { return h*val+'px'; } $('.header p').css({ fontSize: vw(4), marginTop: vh(2) });
Просто не так ли?
Если вы попробовали:
<meta name="viewport" content="width=device-width, initial-scale=1.0">
Затем попробуйте следующее:
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
По моему мнению, некоторые более ранние версии Android и IOS не поддерживают блоки видового экрана http://caniuse.com/viewport-units
Я бы использовал em вместо единиц просмотра, и я бы добавил некоторые медиа-запросы в тег html, чтобы манипулировать размером шрифта. Unit 'em' относительный, поэтому, если я изменю размер шрифта на html, он будет масштабировать размер шрифта на своих дочерних элементах