iPhone 中的 HTML 缩小了 50%答案

【问题标题】：HTML scaled down 50 % in iPhoneiPhone 中的 HTML 缩小了 50%
【发布时间】：2013-08-13 06:58:58
【问题描述】：

我们有一个使用以下 html 的客户网站。当我在桌面上的 Safari 浏览器中打开 URL 时，URL 页面会完全正确地呈现。当在 iPhone 中打开类似页面时，页面会缩小到 50% 的高度。

首先我认为问题出在我们的代码上，但是当我们签入 iPhone 时，我们最后的代码按预期工作。

下面是 HTML。请求帮助。谢谢

<html>
  <head>
  <title>Test.com</title>
 </head>

<!-- frames -->
 <frameset>
    <frame name="test.com" src="http://www.google.com" marginwidth="0" marginheight="0"    scrolling="auto" frameborder="0"></frame>
</frameset>

【问题讨论】：

客户的 iPhone 的像素密度是否与您测试的 iPhone 不同？
不，我们甚至检查了我们的 iphone，结果仍然相同。他在 HTML 中缺少什么？

标签： html iphone ios mobile-safari frameset

【解决方案1】：

问题出在页面的默认视口中。

iOS 上的 Safari 将视口的大小和比例设置为合理适用于大多数网页的默认设置。默认宽度为 980 像素。 (source)

您需要设置自己的视口。通过设置视口，浏览器可以识别内容应该如何适应设备的屏幕。

只需将以下元标记添加到您的应该可以解决您的问题。

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

【讨论】：