网页未调整大小以适应 iPhone 6 Plus 上的屏幕

Webpage is not resizing to fit the screen on iPhone 6 Plus

我在这个特定页面上遇到问题。 http://staging.creativewritingagency.com/contact-us.php

现在，这不是响应式网站。客户只要求他应该能够在第一视图中查看完整的页面（无需在移动屏幕上放大或缩小）。后来，他会捏合捏合来查看和阅读文本。

所以我做了一些研究，发现这可以使用视口元标记来完成。我将以下代码插入到 <head> 部分 

<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes">

据我所知，这段代码应该

但是，此代码似乎仅适用于 Chrome for Android。 iPhone 6 Plus 上的 Safari 浏览器仍在显示整页。这是我在 Browserstack 上模拟 iPhone 6 Plus 时看到的屏幕截图。 http://prntscr.com/81vs1n

有人可以调查一下并指出我可能以不正确的方式做事的地方吗。

P.S。这是我在 Stack Overflow 上的第一个问题。我愿意接受有关改进提问形式的建议。

编辑 - 我的网页宽度为 1170 像素。

width=device-width 是问题所在。

它可以设置为特定数量的像素，如 width=600 或特殊值 device-width 值，即屏幕宽度 CSS 像素，比例为 100%。

视口的宽度（以像素为单位）。默认为980。范围是从200到10,000。

https://developer.mozilla.org/en/docs/Mozilla/Mobile/Viewport_meta_tag

https://developer.apple.com/library/ios/documentation/AppleApplications/Reference/SafariWebContent/UsingtheViewport/UsingtheViewport.html

不根据设备在元标记中设置固定宽度。

所以我在阅读有关视口的更多信息时偶然发现了 this link。今天我了解到视口用于规范化内置缩放行为。

感谢@subodh 指出我的方向。

现在，我已经将我的元标记更新为这样阅读并且它非常有效。

<meta name="viewport" content="width=1180">

编辑 - 忘了说，我从我的实际代码中删除了 initial-scale 。它导致页面缩放到 100% 原始像素，因此，它必须水平滚动。