Question

感到困惑，这是html：

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Welcome</title>

    <link rel="stylesheet/less" type="text/css" href="/Styles/CompiledLESS.less" />
    <script src="/Scripts/JS/less-1.5.0.min.js"></script>
</head>
    <body>
        <div id="mainContentDiv">
            <div>
                <h2>Please Log In</h2>
                <p>You must <a href="/Account">Log in</a> to use.</p>
            </div>
        </div>
    </body>
</html>

CSS就是这样：

body {
    background-color: #D5E6ED;
    background-image: url("~/Images/Background.jpg");
    background-position: center;
    background-repeat: no-repeat;
    color: #444444;
    font-family: Verdana,Tahoma,Arial,"Helvetica Neue",Helvetica,Sans-Serif;
    font-size: 71%;
    margin: 0;
    padding: 0;
}

#mainContentDiv
{
    margin: 0 auto;
    margin-top:0;
    padding: 0;
    width: 997px;
    background-color:#fff;
}

我看不出有什么不对，但结果是当我用firebug检查时，<body>标签与浏览器窗口的顶部没有齐平。

没有其他CSS，就是它的全部内容。

Answer 1

Working Fiddle

h2{
margin:0;
}

Answer 2

你可以试试这个

*{
   margin:0;
   padding:0;
}

Answer 3

只需为#mainContentDiv

指定position:absolute;和top:0;即可

Answer 4

html {
padding: 0;
margin: 0;
}

Answer 5

Binita是对的;虽然我们应该在CSS的顶部设置以下属性默认为0：

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, form, input, button, textarea, p, th, td, a
{
  margin: 0px;
  padding: 0px;
  border-top-width: 0px;
  border-right-width: 0px;
  border-bottom-width: 0px;
  border-left-width: 0px;
}

没有到达页面顶部

5 个答案: