因此,这很奇怪,即使我已经应用了标准的CSS重置,我在页面的顶部也获得了少量利润。如果我在Chrome / Firefox /甚至是IE上打开检查器,我会看到主体正在读取我的margin:0重置,但是无论如何仍会增加一个空白。

间隙:

显示margin:0的Chrome Web Inspector受到好评:


因此,这里的超级duper怪异部分是,如果抛出margin: 0 !important;之类的重要字符,差距就会消失。我已经多次使用此确切的模板设置而没有问题。希望有人看到一些让我眼前一亮的东西。

的HTML

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
    <link href="/Content/css/Reset.css" rel="stylesheet"/>
    <link href="/Content/css/bootstrap-theme.css" rel="stylesheet"/>
    <link href="/Content/css/bootstrap.css" rel="stylesheet"/>
    <link href="/Content/css/Site.css" rel="stylesheet"/>

    <script src="/Scripts/modernizr-2.6.2.js"></script>
    <script src="/Scripts/jquery-1.9.0.js"></script>



    <link href='//fonts.googleapis.com/css?family=Ubuntu:300,400,500' rel='stylesheet' type='text/css'>
    <script type="text/javascript">var base_url = 'http://localhost:64789/';</script>

</head>
<body>
    <div id="wrap">
        <h2>Index</h2>
    </div>
</body>
</html>




的CSS
注意:由于我刚开始执行此项目,因此Site.css现在是空文件。

html,body,p,div,img,h1,h2,h3,h4,li,ul,ol,dl,dd,dt,form {
   margin:0;
   padding:0;
   border:0;
   border-collapse:separate;
   border-spacing:0;
}

a {
    text-decoration: none;
    }

* {
    font-family: 'Ubuntu', sans-serif;
    }

body {
    background: #f0f6e8 url(../images/gradbackground.jpg) repeat-x 0 top;
}

#wrap {
    width: 100%;
    background: transparent url(../images/leaves.jpg) no-repeat center top;
}

最佳答案

页边距在<h2>上,而不在<body>上。 h2必须有其他选择器,该选择器添加了额外的顶部边距。在您自己的Site.css样式中,为margin-top: 0添加h2

10-05 21:03
查看更多