CSS：为什么html，body height: 100%大于100%？
嘿，我试图做一个底部粘性页脚 链接测试，但它一直超过100%，这意味着它滚动了一点..
所以我做了一个简单的HTML代码，没有任何添加，但它仍然超过100%，请参见这里：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="he" lang="he" dir="rtl" id="bangler">
<head>
<title>my title</title>
<style type="text/css">
html, body, #wrapper { height: 100%; }
body > #wrapper { height: auto; min-height: 100%; }
</style>
</head>
<body>
<div id="wrapper">aa</div>
</body>
</html>
问题是，它滚动的幅度比 100% 多一点点，意味着多了 5-10 像素。这在 IE 和 Firefox 上都非常奇怪！
提前致谢 ！
hey, i was trying to do a bottom sticky footer link test and but it kept being more then 100% meaning it scrolled a litle bit..
so i made a simple HTML code, without any additions but its still more than 100%, see here:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="he" lang="he" dir="rtl" id="bangler">
<head>
<title>my title</title>
<style type="text/css">
html, body, #wrapper { height: 100%; }
body > #wrapper { height: auto; min-height: 100%; }
</style>
</head>
<body>
<div id="wrapper">aa</div>
</body>
</html>
the thing is, it scrolls just a little bit more then 100% meaning about 5-10px more.. this is really strange, on both IE and Firefox !!
Thanks in advance !
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（4）
这是因为默认的
body边距。将其添加到您的样式中：It's because of the default
bodymargins. Add this to your styles:为了确保我的网站的跨浏览器兼容性，我总是自己定义正文边距。在本例中：
html, body {margin: 0 0 0 0;填充：0 0 0 0； }直到我学习了相当多的 CSS 知识后，我才意识到正文有自己预定义的边距和填充。
To ensure cross-browser compatibility to my websites, I always define the body margins myself. In this case:
html, body {margin: 0 0 0 0; padding: 0 0 0 0; }I didn't realize that the body had it's own pre-defined margins and padding until I had learned quite a bit of CSS.
因为
padding和/或margin（取决于浏览器）对于html和/或body来说不为零默认情况下，内边距和边距环绕内容高度。Because
paddingand/ormargin(depending on the browser) are non-zero forhtmland/orbodyby default, and padding and margin wrap around the content height.所有浏览器都有自己的小怪癖，它们显示选择器和属性的方式也略有不同，因此 BoltClock 答案所做的只是确保所有浏览器都以零边距和零填充开始处理。
如果您搜索 CSS Reset，您会找到更多相关信息。
All browsers have their little quirks and they also slightly display selectors and attributes differently so what BoltClock answer is doing is just making sure that all browsers deal with start of with a margin of zero and a padding of zero.
If you do a search for CSS reset you will find more information about it.