html - Jumbotron 和 Footer 创建白色边框，即使我将背景颜色设置为黑色

Question

因此，我正在开发我的第一个网站，并尝试使用大图像作为主屏幕的正面。实现超大屏幕时，即使我一直将背景颜色设置为黑色，它也会在图像周围创建一个白色边框。我的页脚也是如此，当我放置背景颜色时，它只会将颜色设置为页脚的区域区域，而不是屏幕的整个底部。我究竟该如何解决这个问题，因为我正试图将屏幕底部设为黑色，而且我还想将图片周围的边框设为蓝色。下面是两张主屏幕的照片，您可以看到白色边框的位置。感谢您的帮助。

This is the footer of my website. I don't understand why only a small portion of the footer is black and not the whole bottom.

This is the large image that I have put on my screen. In my css I have used it as a background image. Every time I change the background color to black the border around the image stays as white.

容器上方的第一个标签是“div class="jumbotron”。出于某种原因，代码片段不允许我放入它。

  <div class="container">`
    <div class="row text-center">`
      <a class="btn btn-primary" href="#"role="button">Hello</a>`
   `</div>`
  </div>`
</div>`

<!-- Write your comments here -->

<footer class="container">
    <div class="row">
    <p class="col-sm-4">
      &copy; Stock
    </p>
    <ul class="col-sm-8">
        <li class="col-sm-1"><img src="https://s3.amazonaws.com/codecademy-content/projects/make-a-website/lesson-4/twitter.svg"></li>
        <li class="col-sm-1"><img src="https://s3.amazonaws.com/codecademy-content/projects/make-a-website/lesson-4/facebook.svg"></li>
        <li class="col-sm-1"> <img src="https://s3.amazonaws.com/codecademy-content/projects/make-a-website/lesson-4/instagram.svg"></li>
        <li class="col-sm-1"><img src="https://s3.amazonaws.com/codecademy-content/projects/make-a-website/lesson-4/medium.svg"></li>
    </ul>
    <p class="col-sm-3">About Us</p>
  </div>
</footer>

CSS

.jumbotron {
  display: flex;
  align-items: center;
  background-image:url('https://inst.eecs.berkeley.edu/~cs194-26/fa14/upload/files/proj3/cs194-di/proj3_sutardja_anthony/imgs/earth_road_joined/road.png');
  background-size: cover;
  height: 700px;
  margin:75px;
  background-attachment:fixed;
  border-style:solid;
  background-color:black;

}

footer {
  font-size: 15px;
  padding: 20px 0;
  color:red;
  font-family: 'Ubuntu', sans-serif;
  margin:10;
  background-color:black;
}

footer .col-sm-8 {
   display: flex;
   justify-content: flex-end;
}

footer ul {
  list-style: none;
}

footer li img {
  width: 32px;
  height: 32px;
}

Answer 1

我的猜测是白色来自页面背景，因为您使用的边距不会扩展元素的背景。

尝试将 body { background-color: black} 添加到您的 css