Question

我正在尝试使用<h3>的窗口（640px），的100％高度来显示div。我看不出我做错了什么。我在模拟器中运行应用程序，它与Cordova有关吗？

$(window).height(); // This is 640px.

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>Test</title>   
</head>
<body>
    <!-- Cordova scripts here -->

    <div style="height: 100%;" >

        <div id="d1" style="background-color: coral; height: 100%;">
            <h3>A div test.</h3>

        </div>

    </div>

</body>
</html>

Answer 1

您应该将其设置为视口的100％：

height: 100vh;

Answer 2

我通常会将body和html标记设置为100％，如here：

body, html {
    height: 100%;
}

.full-width {
    height: 100%;
    background-color: green;
}

Answer 3

您必须在div height之前设置body和html的height。您可以看到您的请求有效here。有了这个CSS，你可以继续：

body, html{height: 100%;}
.height{height: 100%;}

Answer 4

vh =视口高度。请尝试阅读本文 - ＆gt; https://css-tricks.com/viewport-sized-typography/

为什么我不能让我的div填满100％的窗口？

4 个答案: