谷歌Nexus手机提供了巨大的(对我来说)屏幕分辨率和所有我的移动应用程序构建PhoneGap看起来很小。例如,在桌面计算机上测试应用程序时,一切都很好,但在编译并在Google Nexus手机上安装后,按钮变得很小,文本几乎不可读。
我正在使用Twitter Bootstrap,但我担心我会在这款手机的任何其他框架上获得类似的结果。
移动版网页在移动浏览器中显示时,可轻松适应并可在桌面计算机或任何其他设备上使用。只有PhoneGap的应用程序看起来很小。
这个问题有没有简单的解决方法?
答案 0 :(得分:1)
默认情况下,Bootstrap不支持responsive layout。它非常专业地解释:“ Bootstrap目前默认不包含响应功能,因为并非所有内容都需要响应。而不是鼓励开发人员删除此功能,我们认为最好根据需要启用它”。
更改一个meta
代码并将引用从普通CSS替换为<head>
部分中的响应代码确实解决了问题:
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="assets/css/bootstrap-responsive.css" rel="stylesheet">
经过这个简单的更改后,PhoneGap应用程序正确地适应大屏幕尺寸和密度,并以正确的尺寸显示Bootstrap元素。