HTML页面顶部的空白区域

Question

当我在chrome中加载这个（https://github.com/Stannies/TestSite/commit/a79e99cebb016e93b3832c1d31157a59b66510d3）代码时，在页面顶部会出现一个奇怪的白色位置，我试图将边距和填充设置为0px，正如您在代码中看到的那样但它没有帮助

抱歉我的英语不好。

P.S。它只是一个测试网站而且非常难看，但那是因为我刚开始这个项目并遇到了这个奇怪的问题。

图片：http://www.mediafire.com/view/hqv3oqv3boo4vvo/Screen%20Pic.png

Answer 1

除了身体上的边距和填充外，您还需要清除<p id="Title" class="MainText">Test Site </p>

中的默认值

#Title {
    font-size: 50px;
    margin: 0;
    padding: 0;
}

JSFIDDLE

另外，仅供参考，id只能在页面上使用一次，class可以多次使用

Answer 2

如果你只担心上面那么

在你的CSS / stylesheet.css下更改主体原型类

body {
    background-color: #D1D1E0;
    margin-top:0;
}

您可以有保证金，保证金左，保证金最高，保证金权利，保证金底部来分别定义保证金。填充也是相同的情况。

定义边距或填充的所有方向的另一种方法是 保证金：25px 50px 75px 50px; （点击方向：上：25px，右：50px，下：75px，左：50px）

您可以在http://www.w3schools.com/css/css_margin.asp

了解更多选项

Answer 3

正文有一些填充和边距，你应该删除它们。

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

Answer 4

为#wrapper设置margin-top：10px这是因为页面上方有空白区域。