如何让div采用屏幕的高度？

Question

我尝试使用

height: 100%

但这使得div只与其内容一样高 - 它只包含一个单词的文本。

如何强制div使用屏幕高度呢？

Answer 1

您需要body和html元素同时拥有100%高度。

尝试以下CSS：

html, body {
    margin: 0;
    padding: 0;
    height: 100%;
}

YourDivSelector {
    height: 100%;
}

边距和填充必须设置为0以防止在Firefox中自动滚动。

Answer 2

您应该将包含div的所有容器设置为高度：100％，包括body和html标记。

Answer 3

您还需要将html和body设置为height：100％;

 html,body{height:100%}

Answer 4

我遇到了同样的问题。将 html 和 body 高度设置为 100% 不起作用，但是当我将 100vh 的最小高度和 div 的高度 100% 结合起来时，它起作用了。

html, body {
   height: 100%;
}

div {
   min-height: 100vh; 
   height: 100%;
}

Answer 5

您可以获取窗口using JavaScript的宽度和高度，然后根据需要使用这些值设置div的高度和宽度。

Answer 6

也许

min-height:100%;

你准备做什么了？发布更多信息，我们可以为您提供更多帮助

Answer 7

如果定义包含元素的高度，则只能有意义地使用height = 100％。它的100％，是什么？如果在任何地方定义没有高您可以使用javascript获取当前窗口的高度（如前所述），或指定特定高度800px或任何值。 ：d