当我注意到后续的 block 元素是从前一个 block 元素的内容开始而不是紧接在前一个 block 元素的边距之后时，我正在编写一些 HTML 并对其进行样式设置。我小时候有一个 block 元素和一个内联元素。内联元素在底部有一些内边距和一个边框。我在第一个 block 元素之后直接创建了另一个 block 元素，在检查此页面后我注意到了上面的内容。我错过了什么吗？谢谢!
#last-updated-timestamp {
font-weight: normal;
font-style: italic;
padding-bottom: 10px;
border-bottom: 2px solid #e6e6e6;
margin-bottom: 0px;
} <!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1" charset="utf-8">
<title>Test</title>
</head>
<body>
<div id="profile">
<span id="last-updated-timestamp">Last updated Jan 1, 2019</span>
</div>
<div id="flex-container">
</div>
</body>
</html>
最佳答案
您不能向内联元素的顶部/底部添加边距/填充，浏览器对它们的处理方式不同。
也许使用 inline-block 代替？
关于html - 为什么后续 block 元素的框从前一个 block 元素的内容而不是前面元素的边框开始？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/54000021/