html - 如何让div容器满屏幕高度？

Question

好的，我正在制作我的第一个 iOS HTML5 应用程序，它只是一个简单的报价应用程序。我需要弄清楚如何让我的容器 div 成为 iphone 的全高。这是我设计的 jsfiddle - http://jsfiddle.net/gKaDL/1/

.container {
width: 640px;
min-height: 100%;
background-size: cover;
background-position: center;
background-color: #1a1a1a;
}

因为很多引用都很短，所以容器 div 达不到 iPhone 4 的 960px 屏幕高度，更不用说 iPhone 5 的 1136px 高度了。容器 div 必须是屏幕大小或更大，因为它上面有一个必须填满屏幕的背景图像。

谢谢。

Answer 1

您有一个 CSS 单位 vh 以视口(viewport)高度的百分之一为单位。在这种情况下你会写:

height: 100vh;

或者您可以强制 div 粘附到最近定位的父级的顶部和底部(因此将 position:relative 或 position: absolute 给具有合适的高度):

position: absolute;
top: 0;
bottom: 0;

如果您需要更多详细信息，请告诉我