小智 275
页面的像素宽度和高度将取决于方向以及元视口标记(如果已指定).以下是在iPad 1浏览器上运行jquery的$(window).width()和$(window).height()的结果.
当页面没有元视口标记时:
当页面包含以下两个元标记时:
<meta name="viewport" content="initial-scale=1,user-scalable=no,maximum-scale=1,width=device-width">
<meta name="viewport" content="initial-scale=1,user-scalable=no,maximum-scale=1">
用<meta name="viewport" content="width=device-width">:
用<meta name="viewport" content="height=device-height">:
用<meta name="viewport" content="height=device-height,width=device-width">:
同 <meta name="viewport" content="initial-scale=1,user-scalable=no,maximum-scale=1,width=device-width,height=device-height">
同 <meta name="viewport" content="initial-scale=1,user-scalable=no,maximum-scale=1,height=device-height">
mac*_*tic 13
这个问题没有简单的答案.用于iPhone,iPod Touch和iPad的Apple的移动版WebKit将缩放页面以适应屏幕,此时用户可以自由放大和缩小.
也就是说,您可以设计页面以最小化所需的缩放量.你最好的选择是使宽度和高度与iPad的较低分辨率相同,因为你不知道它的方向是什么; 换句话说,你可以制作你的页面768x768,这样它就能很好地适应iPad的屏幕,无论它是面向1024x768还是768x1024.
更重要的是,您需要设计具有大量控件的页面,这些控件具有很多容易用拇指轻松敲击的空间 - 您可以轻松地设计一个非常混乱的768x768页面,因此需要大量缩放.为此,您可能希望将控件划分为多个网页.
另一方面,这不是最值得追求的.如果你在设计时发现机会让你的页面更加"手指友好",那就去吧......但实际情况是,iPad用户非常适合移动和放大页面以获取内容,因为它在大多数网站上都是必要的.如果有的话,你可能想要设计它,以便它有利于这种类型的导航.
制作具有相关分组数据的方框,可以轻松双击以关注,并使相关控件保持彼此靠近.iPad用户很可能会欣赏一个页面,这个页面有助于熟悉他们习惯的缩放和平移导航,而不是一个控制较少的页面,这样他们就不必这么做了.