html - 创建家庭作业并需要帮助修复背景颜色

Question

我正在努力创建包含其中内容的背景颜色，这是我到目前为止在本网站其他人的帮助下得出的结果，但我遇到了一个难题。当我插入这段代码时，它创建了我想要的东西，但有一个问题，在边框上有一个白色区域围绕着彩色框。蓝色框的顶部是蓝色框和页面顶部之间的小空白，以及蓝色/红色/绿色框的两侧，页面末尾和框之间有一个小空白。我该如何更改此空白区域并用其匹配的颜色填充。

这只是一个测试，我只是在对家庭作业进行实际更改之前弄乱它。我的目标是让页面顶部的 10% 成为某种颜色(如浅蓝色)，80% 成为另一种颜色(中间像象牙色)，然后在底部使它像灰色。

div {
  height: 100px;
  position: relative;
}

.a:after, .b:before, .c:after {
  content: "";
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  display: block;
  position: absolute;
}

.a {
  background: blue;
}

.b {
  background: red;
}

.c {
  background: green;
}

<div class="a"> </div>
<div class="b"> </div>
<div class="c"> </div>

Answer 1

将其插入您的 CSS 代码中。

body {
    margin:0;
}