Question

尽管我没有这样设置，但我的图像上方似乎有空白。

我什至尝试将margin-top设置为0，但这不能解决问题。

#header {
  background-image: url(https://s3-eu-west-2.amazonaws.com/theartonlinegallery-wp/wp-content/uploads/20180627134442/london-cityscape.jpg);
  background-repeat: no-repeat;
  height: 350px;
  background-position-x: 100%;
  background-posititon-y: 75%;
  background-size: 1400px;
  opacity: 0.8;
  text-align: center;
  font-family: "Poiret One";
  color: white;
  margin-top: 0px;
}

<div id="header">
  <h1>Investment Blog</h1>
</div>

Answer 1

如果运行您发布的代码段并查看计算出的样式，您会看到，虽然div确实具有margin-top为0，但h1块包含其中的“投资博客”的margin-top不能为0。您必须为标题设置其他样式。

Answer 2

这是因为body标签具有您看不到的默认值。尝试将body { margin:0px; padding:0px; }添加到CSS文件中，它将默认填充和边距设置为0。

Answer 3

您需要将body和h1的边距都设置为0，例如：

   body,
   #header h1 {
      margin-top: 0;
   }

即使我将其设置为0px，为什么在图像上方仍留有页边距？

3 个答案: