0

我的 HTML 中有一个body标签,它应该填充整个页面(整个html标签如此),但它在页面顶部和body标签顶部之间出现了一些像素。

奇怪的是,如果我强制body {padding: 0;}使用我的 CSS,页面顶部仍然有这个小条body无法填充,而如果我设置padding为任何非零值,小条会被覆盖body并指定填充被申请;被应用。

这是我的琐碎 CSS(它设置了一个用s 和普通东西body填充的 HTML 标记):div

html {
    height: 100%;
    margin: 0;
    padding: 0; // this is ok, html fills the whole page
}

body {
    margin: 0;
    height: 100%;
    padding-top: 1px; // here, if I write padding:0;, space at the top will not be filled by body
} 

编辑

这是我的HTML,我不知道它是否有用。

<body>
    <div id="container">

    <header id="page_header">
        stuff
    </header>

    <section id="page_content">
        stuff
    </section>    

    <footer id="page_footer">
        stuff
    </footer>

    </div> <!-- end of div#container -->
</body>

注意:我正在使用 Firefox 和 Chrome,行为相同。

4

1 回答 1

1

您可以尝试清除 html 和 body 标签 CSS 规则,然后简单地说:

/* basic CSS reset */
* {
  padding: 0;
  margin: 0;
}

html, body {
  height: 100%;
  width: 100%;
}
于 2013-03-22T00:10:26.243 回答