什么是iPhone屏幕分辨率？

我知道这已被问到，但我仍然感到困惑。什么是iPhone屏幕分辨率？

我想为iPhone构建一个简单的页面：徽标在顶部，电话号码，地址以及占用整个屏幕（无重复）的BG。

当我运行一个脚本打印screenwidth和screenheight我得到：320px * 480px。

但是，当我创建这些确切尺寸的div时，它很小。是什么赋予了？应该是检测到的分辨率的整个尺寸的框不占据整个屏幕？因此，如果我为iPhone设计一个页面，并且我希望它在Safari（iPhone上）占据整个屏幕，那么我应该设计什么样的分辨率？

我正在使用运行iOS 4.0的iPhone 3G作为我的测试设备。

感谢您的任何帮助。

来源

2010-07-13 AJB

你可能想全屏选项，以及设置初始尺寸 – 2010-07-13 19:56:12

您需要视口元标记来告诉iPhone您的网站是专门为它设计的。

使用此：

<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"/>

您可以更改缩放选项，如果你需要用户放大等。

此外，如果你希望你的应用在横向模式下工作，以及，你可以将宽度设置为100％。

#wrapper { 
    width: 100% 
    max-width: 480px; 
}

来源

2010-07-13 19:53:52 Marko

Oiy。感谢Marko。这对我来说是新的，我想我可能会失去理智。 – AJB 2010-07-13 20:09:35

这取决于哪个iPhone。原来的3G和3GS是320x480，4.0是640x960的两倍。如果您设计的分辨率较高，那么较旧的手机会将其缩小50％，应该看起来不错。

您可能还想了解如何使用媒体查询来优化iPhone体验。关于this blog post的更多内容。

来源

2010-07-13 19:53:06

感谢技术规格Tim。 – AJB 2010-07-13 20:10:29

问题是iPhone试图自行调整它。如果你把这个标签放在页面的头部，它会告诉手机“别担心，我会自己处理内容的大小”，并强制屏幕以1：1的比例。

<meta name = "viewport" content="inital-scale=1.0">

来源

2010-07-13 19:53:27 mclark1129

感谢Mike的帮助。 – AJB 2010-07-13 20:11:08

其他答案是正确的，你需要配置视口。

这个苹果官方文档是在这里：

http://developer.apple.com/safari/library/documentation/AppleApplications/Reference/SafariWebContent/UsingtheViewport/UsingtheViewport.html#//apple_ref/doc/uid/TP40006509-SW1

值得通过whole document略读 - 以及一个很多视标签的描述，它（配有图片！）也有很多其他有用的建议，将网页定位到iphone。

来源

2010-07-13 19:57:04 JosephH

王牌，感谢约瑟夫，看起来正是我需要的东西。那么，当我读它时，还有一壶咖啡。 – AJB 2010-07-13 20:13:22

你可能想使用所有这些

<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" /> 
<!-- this one tells Mobile Safari to hide the Address Bar and make the app fullscreen --> 
<meta name="apple-mobile-web-app-capable" content="yes" /> 
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />

来源

2010-07-13 19:57:24

非常好，谢谢模糊。但是，隐藏地址栏的标签似乎不适合我。财产标题应该是最后一个的“名称”，还是一个错字？ – AJB 2010-07-13 20:15:33

快速搜索说这只是一个错字。 – AJB 2010-07-13 20:20:55

此外，如果“应用程序”保存到主屏幕，似乎标签只隐藏状态和地址栏。仍然看着它。 – AJB 2010-07-13 20:25:43

在MonoTouch中，尝试

var yourFrame = FrameForOrientation(CurrentInterfaceOrientation);

这些方法

public static UIInterfaceOrientation CurrentInterfaceOrientation { 
    get { 
     return UIApplication.SharedApplication.StatusBarOrientation; 
    } 
} 

public static RectangleF FrameForOrientation(UIInterfaceOrientation orientation, bool subtractStatusBarHeight = true) { 
    var screen = UIScreen.MainScreen; 
    var fullScreenRect = screen.Bounds;  // always implicitly in Portrait orientation. 
    var appFrame = screen.ApplicationFrame; 


    // Initially assume portrait orientation. 
    var width = fullScreenRect.Width; 
    var height = fullScreenRect.Height; 

    // Correct for orientation. 
    if (IsLandscapeOrientation(orientation)) { 
     width = fullScreenRect.Height; 
     height = fullScreenRect.Width; 
    } 

    var startHeight = 0.0f; 
    if (subtractStatusBarHeight) { 
     // Find status bar height by checking which dimension of the applicationFrame is narrower than screen bounds. 
     // Little bit ugly looking, but it'll still work even if they change the status bar height in future. 
     var statusBarHeight = Math.Max((fullScreenRect.Width - appFrame.Width), (fullScreenRect.Height- appFrame.Height)); 

     // Account for status bar, which always subtracts from the height (since it's always at the top of the screen). 
     height -= statusBarHeight; 
     startHeight = statusBarHeight; 
    } 
    return new RectangleF(0, startHeight, width, height); 
} 

public static bool IsLandscapeOrientation(UIInterfaceOrientation orientation) { 
    return 
     orientation == UIInterfaceOrientation.LandscapeLeft || 
     orientation == UIInterfaceOrientation.LandscapeRight; 
}

来源

2013-01-24 05:36:06

什么是iPhone屏幕分辨率？

回答

相关问题