Question

我不太明白为什么页脚（和页眉）没有占用所有空间？我将<body>部分划分为3个部分：1）div标头，2）div包装器，3）div页脚（以便我可以分别控制每个部分）。

div包装器（应该是狭窄的）

.wrapper {
display: block;
width: 100%;
max-width: 980px;
margin: 20px auto;
padding: 20px;
border: 1px solid black;}

div页脚（应该在屏幕上为100％宽）

.footer {
margin: 0px;
padding: 0px;
background-color: black;
height: 200px;
color: orange;
width: 100%;}

如何覆盖所有空间（就像在本网站上一样，标题占据了所有空间，但是主要内容部分要狭窄得多）。

提前谢谢！

Answer 1

似乎您没有为大多数浏览器默认添加的body重置默认边距。为此，请添加以下内容：

body {
  margin:0;
}

Answer 2

解决此问题的方法不止一种，并且首先可能会产生问题的原因不止一个，因此如果其他人给您不同的答案，也不要踩踏：）

我最常看到的问题是父元素不具有完整宽度或填充大于零而产生的。（可能是身体）。

如果这不是问题所在，请尝试使用这些媒体查询（一次）。

width: -webkit-fill-available;

width: 100vw