为iPad设计网站

Question

我需要一些关于如何为Apple iPad设计网站的建议。

首先是事实和我的计划：  事实：   - iPad拥有1024x768的屏幕   - 可见的是（FOLD）肖像是916，陆地是660。        我不确定这些信息，因为有很多不同信息的页面。 （在某处读取952，所以如果你有Ipad，请用标准SAFARI设置确认正确的号码）

我的计划：

我的设计计划是一个很长的单页网站。  例如     - 五个菜单页面（这意味着我在另一个下面有5个div）     - 每个菜单都是电影     - 访客总是看到一个菜单，所以一个电影 - qube

我的问题：

• iPad上的尺寸是正确的吗？
• 如何使我的DIV尺寸（高度）适合屏幕？       如果这可能比：            - 导致这在PC上查看的任何问题？ （所以我只有在浏览器代理是iPad时才需要使用此设置？）

感谢您的任何建议。

Answer 1

如果您无法访问iPad进行测试，那么您最好查看模拟器。类似于：http://ipad-emulator.org/

的内容

请记住，虽然Safari并不是唯一可用于iPad的浏览器，因此您根据其进行的任何尺寸估算都可能不适用于其他浏览器。

否则，谷歌是你的朋友： How to fit your website for the Apple iPad

Answer 2

如果您尝试在桌面浏览器和iPad上访问网站，我建议您使用CSS媒体查询构建网站。它允许您根据浏览器大小更改站点。

http://www.w3.org/TR/css3-mediaqueries/

语法很简单，这是一个例子：

@media screen and (max-width:443px) and (min-width:250px){
    .class{}
    #id{}
}

这种方式的工作方式是当屏幕介于250px和443px之间时，它会应用其中的样式。只要将媒体查询保留在CSS文档的底部，就会覆盖其他属性。这样做的好处是，您可以通过调整浏览器窗口的大小来测试它。