css - 如何通过 PhoneGap 制作基于设备宽高的 html 和 css

Question

我刚刚开始通过 PhoneGap 使用 Html、Css、Js 设计一个移动应用程序，我的首要目标是确保所有内容都完美适合任何给定的手机。所以我想问问大家我的做法是否正确，我应该如何实现。

我的想法是通过 JavaScript 获取设备的宽度和高度，我认为有一些 PhoneGap 函数可以返回这些值。然后我将使用这些值来设置 html 宽度和高度(我想我应该通过 onBodyLoad() 函数来执行此操作，如果错误请纠正我)，这样我将 html 正文设置为设备屏幕大小，然后我通过 % 而不是像素定位所有其他元素。

我也在一些随机搜索中看到了这一行:

<meta name="viewport" id="viewport"
 content="width=device-width, height=device-height,
 initial-scale=1.0, maximum-scale=1.0,
 user-scalable=no;" />

这看起来也应该有效，但我不太确定它是否有效，以及它是如何工作的。 Soo...你们认为最好的方法是什么？也许还有其他我不知道的？

非常感谢您的帮助!

Answer 1

根据您使用的元素等，您应该能够将宽度设置为百分比，而不需要任何 javascript 或类似的东西。

您发布的视口(viewport)代码块是非常标准的 Phonegap 代码，因此您无法在页面等上查看。