在iPhone和iPad屏幕視口上適合網站？

Question

在Apple於2016年3月發布最新的iOS更新9.3.1之前，我的所有網絡專家都習慣將其安裝在iPhone（橫向模式）和iPad（縱向和橫向）的屏幕上。

發布后，我的網站顯示為縮放狀態，我必須向內/向外滑動才能使網站再次適合整個屏幕。 我嘗試了在不同論壇上找到的許多東西，但是沒有幫助...

標簽<meta name="viewport" content="width=device-width, initial-scale=1">用於制作標簽，並突然停止工作。 任何想法？

您可以在www.buenosaireshelicopter.com查看示例。

iOS 9.3.1更新后訪問網站

在iOS 9.3.1更新之前查看網站

Answer 1

我將其用於我的網站。 這可能是矯kill過正，但我​​從來沒有遇到過問題。

 /* Smartphones (portrait and landscape) ----------- */ @media only screen and (min-device-width : 320px) and (max-device-width : 480px) { /* Styles */ } /* Smartphones (landscape) ----------- */ @media only screen and (min-width : 321px) { /* Styles */ } /* Smartphones (portrait) ----------- */ @media only screen and (max-width : 320px) { /* Styles */ } /* iPads (portrait and landscape) ----------- */ @media only screen and (min-device-width : 768px) and (max-device-width : 1024px) { /* Styles */ } /* iPads (landscape) ----------- */ @media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) { /* Styles */ } /* iPads (portrait) ----------- */ @media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) { /* Styles */ } /* Desktops and laptops ----------- */ @media only screen and (min-width : 1224px) { /* Styles */ } /* Large screens ----------- */ @media only screen and (min-width : 1824px) { /* Styles */ } /* iPhone 4 ----------- */ @media only screen and (-webkit-min-device-pixel-ratio : 1.5), only screen and (min-device-pixel-ratio : 1.5) { /* Styles */ } /* iPhone 6 landscape */ @media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) { } /* iPhone 6 portrait */ @media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) { } /* iPhone 6 Plus landscape */ @media only screen and (min-device-width: 414px) and (max-device-width: 736px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 3) { } /* iPhone 6 Plus portrait */ @media only screen and (min-device-width: 414px) and (max-device-width: 736px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 3) { } /* iPhone 6 and 6 Plus */ @media only screen and (max-device-width: 640px), only screen and (max-device-width: 667px), only screen and (max-width: 480px) { } /* Apple Watch */ @media (max-device-width: 42mm) and (min-device-width: 38mm) { }