这个问题以前在这里问过，是的。但似乎没有一个答案对我和我想做的事情有用。
我需要一个 div 来显示整个浏览器。到目前为止，我有这个。
HTML
<body>
<div id="header">My Website</div>
<div id="games">Video Games</div>
</body>
CSS
#header {
height: 80px;
background-color: black;
color: white;
width: 100%;
top: 0;
left: 0;
position: absolute;
}
#games {
height: 40px;
border: 1px solid black;
background-color: grey;
}
因此，top:0、left:0 和 position:absolute 是让我的 div 横跨整个页面的原因。有什么问题？
我的#games div 隐藏在我的#header div 后面。我对 html 和 css 比较陌生，当我开始学习 div 时，它们会彼此紧挨着显示，或者在彼此的下方和上方显示。
当我取出 position:absolute 时，#games div 下降到 #header div 下面，但随后 header div 只去了到页面左侧和右侧的边缘，以及顶部。我希望它一直延伸到边缘，在 div 和浏览器端之间没有空间，并且让我的 #games div 自然显示在下方。
请注意，我知道我可以调整 #games div 的上边距，但我想知道是否有办法让它自然地位于 #header div< 下方.
我该怎么做才能使我的#games div 不会自然地隐藏在#header div 后面，而是位于正下方？
最佳答案
我的建议是这样做DEMO :
body {
margin: 0;
}
#header {
height: 80px;
background-color: black;
color: white;
}
#games {
height: 40px;
border: 1px solid black;
background-color: grey;
}
关于html - 使用 CSS 和 html 使一个 Div 显示在整个浏览器中，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/24006644/