viewport - 混合移动应用视口

Question

我只为 android 制作混合应用程序，设计师给了我 480px（最小尺寸）布局。

我像这样声明了元视图端口...

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

我的CSS也是

 body {min-width:480px; height:100%;}

问题是当我在手机上测试时，几乎每个浏览器都能完美显示！但移动 Chrome 浏览器除外。它在屏幕上显示更大的布局并溢出...

我做错了什么？

Answer 1

据我了解，Android 设备不使用视口。iOS 设备可以。你的 CSS 实际上正在接管。因此，根据您设备的初始宽度（小于 480 像素），您的布局会因为最小宽度而溢出。您最好的选择可能是使用 min-width:320px 和 width:100%。试试看。“移动 Chrome 浏览器”是什么意思。您是指手机上预下载的本机浏览器，还是您从 Play 商店下载的 Chrome 浏览器？