尽管没有 h1 和正文边距设置为 0px，但我页面顶部的奇怪顶部边距答案

【问题标题】：Weird top margin on top of my page despite having no h1's and body margin set to 0px尽管没有 h1 和正文边距设置为 0px，但我页面顶部的奇怪顶部边距
【发布时间】：2017-02-03 12:37:02
【问题描述】：

现场示例

http://geovillageva.com/

我有一个奇怪的边距问题。我已将正文边距设置为 0px，并且无法使用 Inspect Element 确定边距来自何处。

页眉的HTML

<div id="header">
    <img id="logo" src="/image/header.png" alt="GeoVillage Banner" style="width:500px;height:64px;">
</div>

页眉的CSS

body {
    margin: 0px;
}

#header{
    display:block;
    padding: 20px 100px;
    background-image: url(/image/headerbackground.png);
    background-repeat: repeat-x;
}

如果您想要整个页面的 html，请检查网页上的元素。我用 PHP 编写过代码，所有变量等等都非常混乱。

【问题讨论】：

看看你渲染的源代码 (view-source:geovillageva.com)。如您所见，HTML 无效，并且有多个根 html 标记。这就是导致问题的原因。
-=<!DOCTYPE html> - -= 是什么？

标签： html css

【解决方案1】：

我明白了~= 在正文标签下方和指向 css 的上方链接。删除那个多余的。

【讨论】：

【解决方案2】：

body和html不要使用margin和padding，设置在div的同时删除这个符号https://yadi.sk/d/vq-uOlwZ3CarQV

【讨论】：

【解决方案3】：

我想我找到了问题所在。你的html结构不对。

目前是：

<!DOCTYPE html>
<html>
    <head>
        <title>GeoVillage - A Community</title>
        <link rel="stylesheet" href="defaultstyling.css">
        <link rel="stylesheet" href="style.css">
        <link rel="icon" type="image/png" href="/image/logo.png">
    </head>
    <body>
        -=<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" href="/navbarstyle.css">
    </head>
    <body>

但应该是这样的：

<!DOCTYPE html>
<html>
    <head>
        <title>GeoVillage - A Community</title>
        <link rel="stylesheet" href="defaultstyling.css">
        <link rel="stylesheet" href="style.css">
        <link rel="icon" type="image/png" href="/image/logo.png">
        <link rel="stylesheet" href="/navbarstyle.css">
    </head>
    <body>

试试这个，我认为它会起作用。

【讨论】：