0

好的,所以我一直在与一位在 Photoshop 中制作应用程序模型的设计师合作。我没有使用 iPhone 状态栏,也没有使用设计师由 100px 制作的自定义导航栏。在那个导航中,他放了一个 48 像素的图标。

现在我必须转换为代码,为此我使用 UIWebView。他设计的布局,我将在 HTML/CSS 中制作,将在 UIWebView 中加载。

现在的问题是,他为屏幕制作的 PSD 尺寸为 640 x 960。在 Iphone4 中,它是分辨率而不是物理尺寸。基于 640 x 960 像素 Image/PSD 的设置,他制作了 100 像素的顶栏。现在如果我跟着他,事情就会变得一团糟。

我所做的只是将所有内容缩小一半以适应 CSS 中的 320 x 480 屏幕大小。我将导航栏设置为 50 像素(适用于 320 x 480),并将@2x.png 图像(48 x 48)放入其中。

现在,当我在我的手机中加载应用程序时,它看起来应该很大,这给我的印象是 48 像素没有显示为 24 像素的高密度图像。

我很困惑,如果我制作 100 像素的导航栏,那么一切看起来都很大,因为我的目标是大尺寸,而我必须以高分辨率为目标。如何在我的场景中调整元素(DIV)和图像?

4

1 回答 1

0

Take a look at these articles on using CSS3 media queries and the viewport tag in order to help manage styles between normal and high definition displays:

Targeting the iPhone 4 Retina Display with CSS3 media queries

iPhone 4 and iOS 4 Safari Detection and Behavior

于 2012-08-02T20:39:12.113 回答