Ipad的水平宽度问题

Question

我正在构建一个移动优化版本的网站并测试不同的移动设备，但我似乎无法弄清楚如何让这个页面不会扩展到超过ipad的水平宽度。

http://www.iirusa.com/upload/wysiwyg/2011-P-Div/P1656/Mobile_web/home.html

那是我正在建设的页面。只是为了澄清，在Ipad上垂直视图很合适。但是在水平视图上，它会超出宽度，用户必须捏它才能查看整个页面。我使用100％的宽度容器，我假设是问题，但如何在不影响垂直视图宽度的情况下使水平视图更小？

提前感谢您的帮助!!

Answer 1

@SERIK;首先在viewport中定义meta tag。 像这样。

<meta name="viewport" content="user-scalable=no, width=device-width" />

有关详细信息，请参阅这些链接http://matthewjamestaylor.com/blog/ipad-layout-with-landscape-portrait-modes，http://www.htmlgoodies.com/beyond/webmaster/toolbox/article.php/3889591/Detect-and-Set-the-iPhone--iPads-Viewport-Orientation-Using-JavaScript-CSS-and-Meta-Tags.htm，http://thomasmaier.me/blog/2010/03/04/howto-css-for-the-ipad/

Answer 2

您是否尝试过将viewport元标记用于移动版游戏？

Answer 3

您只需将其添加到页面模板html：

即可

<meta name = "viewport" content = "width = device-width">

在Safari Developer Library

中查看更多详情