Question

我使用这种技术使我的div高度为100％：

body, html {
height: 100%;
}

#myDiv {
  height: 100%;
}

并且在通常的设备上一切都很完美，但是在大分辨率（27英寸）的屏幕上它无法正常工作，我该如何解决？谢谢！

Answer 1

将body标签的默认边距设置为0px，可能会有效。例如我添加了以下代码，它对我来说很好

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
        <style type='text/css'>
        body, html {
            height: 100%;
            margin:0px;
        }
        #myDiv {
            height: 100%;
            background:red;
        }
        </style>
    </head>
    <body>
        <div id='myDiv'></div>
    </body>
</html>

Answer 2

你的div需要绝对定位。

＆＃13;

*{
  margin: 0px;  
}
html, body, .parent {
	height: 100%;
}
.parent {
	background: red; /* for visual */
	position: relative; /* needed */
}
.child {
	background:blue; /* for visual */
	position: absolute; /* needed */
	top: 50%; /* needed */
	transform: translateY(-50%); /* needed */
}

＆＃13;

<div class='parent'>
	<div class='child'>Hello.</div>
</div>

＆＃13;

div的高度：27英寸显示器上的100％不工作

2 个答案: