页面顶部和 html 内容之间的空间答案

【问题标题】：Space between page top and html content页面顶部和 html 内容之间的空间
【发布时间】：2021-10-25 08:58:12
【问题描述】：

我已经多次看到这个问题，但答案似乎从未奏效。我的“h1”标题旁边有一个浮动图像，我无法删除项目和页面边缘之间的空间。我通过将 body margin 设置为 0 解决了左侧的问题，但顶部仍然有这个间隙。

#Logo
    {
        float: left;
        border-right: solid;
        border-bottom: solid;
    }

    #Title
    {
        font-size: 70px;
        border-top: solid;
    }

    header
    {
        margin: 0;
    }

    body, html {
        margin: 0;
        padding: 0;
    }

<!DOCTYPE html>
 <html>
<head>
    <meta charset="utf-8">
    <link rel="stylesheet" type="text/css"      href="Site_Web_1.css">
    <title></title>
</head>

<body>
    <header>
        <div id="Logo"><img src="images/Logo.png"></div>
    
        <h1 id="Title">Evil Mouse Coding</h1>
    </header>
</body>

</html>

【问题讨论】：

这能回答你的问题吗？ How to disable margin-collapsing?
这称为折叠边距，h1 的边距顶部（来自用户代理样式表）正在向下移动整个标题元素。

标签： html css padding margin

【解决方案1】：

在 h1 css 中使用 margin-top: 0

#Title
    {
        font-size: 70px;
        border-top: solid;
        margin-top: 0;
    }

【讨论】：