我有一个基于 Web 的游戏的 CSS 布局，它被设计为仅适合 iPad 屏幕（它在 iPad 应用程序中运行）。现在我想把同样的游戏移植到 iPhone 上。如果我只是使用 iPhone 5 模拟器运行该应用程序，它只会显示一个 320x568 的屏幕部分。
我想知道是否有办法（自动？）缩小页面上的每个组件，使其更小并适合 iPhone 5 的屏幕。有很多图像是在设计时考虑了 iPad 的分辨率，所以它们比 iPhone 上的图像要大。CSS可以根据屏幕大小调整它们的大小，还是我需要手动调整它们的大小？
在 index.html 文件中，我已经包含了：
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
但是，它不会自动调整到 iPhone 的屏幕大小。还有很多硬编码的像素值。我可以简单地将它们更改为相对于屏幕的百分比吗？
作为记录，我没有编写这段代码，也不擅长 CSS。谢谢您的帮助。