Question

我有2个文件：1个是.html文件，另一个文件是.css文件这是它们的内容：

#left,
#right {
  display: inline-block;
}

#left {
  width: 15%;
  height: 550px;
  margin-bottom: 100px;
  margin-left: 10px;
  border: 1px solid black;
}

#right {
  width: 80%;
  margin-left: 25px;
}

#header {
  width: 100%;
  height: 100px;
  border: 1px solid black;
}

#content {
  width: 100%;
  height: 500px;
  border: 1px solid black;
  margin-top: 10px;
}

#footer {
  width: 100%;
  height: 100px;
  border: 1px solid black;
  margin-top: 10px;
}

#menu {
  width: 100%;
  height: 50%;
  background-color: red;
}

<div id="left">
</div>
<div id="right">
  <div id="header">
  </div>
  <div id="content">
  </div>
  <div id="footer">
  </div>
</div>

如果我在<h1>或#left内添加1个#header, #footer, #content元素，则然后它们的位置下降。我不知道为什么会这样。请帮忙。

Answer 1

浏览器正在向影响父元素的h1元素（可能在顶部）添加默认边距和填充。转到浏览器，然后单击检查元素。这将显示默认值。然后，您可以根据需要在代码中指定值。

div元素内的h1元素存在问题

1 个答案: