为什么内部元素的上边距会取代其父 Div，如何修复它？

影响包装 Div 放置的顶部边距

将上边距应用于页面上的初始可见元素（例如页眉分隔）时，它可能会无意中取代整个部门。这是浏览器默认级联行为的结果。

要解决此问题，解决方案是对父分区实现以下 CSS 规则：

overflow: auto;

通过指定此规则，父分区将调整其高度以适应内部元素的上边距，从而防止分区被向下推。

这是包含此内容的更新代码片段解决方案：

div#header {
  width: 100%;
  background-color: #eee;
  position: relative;
  overflow: auto;
}

div#header h1 {
  text-align: center;
  width: 375px;
  height: 50px;
  margin: 50px auto;
  font-size: 220%;
  background: url('/images/name_logo.png') no-repeat;
}

通过实施此技术，应用于 h1 元素的上边距将不再影响标题分区的定位。

以上是为什么内部元素的上边距会取代其父 Div，如何修复它？的详细内容。更多信息请关注PHP中文网其他相关文章！