如何讓我的iPhone瀏覽器達到身高：100％？

我有一個網站，最小寬度設置爲767px，直到我可以開始製作純粹的移動版本。如何讓我的iPhone瀏覽器達到身高：100％？

但是，如果捏住這個來查看整個767寬度，則高度不會達到100％。當縮小到1

這似乎停留在任何高度設定是截圖：

它工作正常景觀，但不是肖像。

我該如何解決這個問題？

編輯：這是一個完整的HTML顯示問題...

<!DOCTYPE HTML> 
<html> 
<head> 
    <meta charset="utf-8" /> 
    <meta name="viewport" content="height=device-height, width=device-width, initial-scale=1.0" /> 

    <style> 
     html, body { 
      width: 100%; 
      min-width: 100%; 
      height: 100%; 
      min-height: 100%; 
      height: 100vh; 
      min-height: 100vh; 
      background: red; 
      padding: 0; 
      margin: 0; 
     } 

     #navbar { 
      background: blue; 
      min-width: 767px; 
     } 
    </style> 
</head> 
<body> 
    <div id="navbar">Test</div> 
    <div ng-view id="mainBody">Test</div> 
</body> 
</html>

來源

2015-12-12 Scottie

添加一個meta標籤視口

<meta name="viewport" content="height=device-height, initial-scale=1.0" />

可以用VH單元爲全高：

#mydiv { 
    display:block; 
    height:100vh; 
}

請參閱css3上的單元w3schools

來源

2015-12-13 00:02:15 MoonYard

試過這個。似乎沒有幫助。 – Scottie

不要忘記將全高設置爲body和html。找到jsfiddle http://jsfiddle.net/JamesD/hr8sL/ – MoonYard

如何讓我的iPhone瀏覽器達到身高：100％？

回答

相關問題