Html <body> with overflow:scroll 没有按预期运行
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4998291/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
<body> with overflow:scroll not behaving as expected
提问by Caio
Look at the following image and code:
看下面的图片和代码：
<!doctype html>
<html>
<head>
<style>
body {
border: 1px solid red;
padding: 20px;
overflow: scroll;
}
</style>
</head>
<body></body>
</html>
The overflow: scrollinserts scroll bars inside the element, but the <body>element doesn't occupy the entire webpage, what is wrong with the scroll bars?
该overflow: scroll刀片滚动元件的内部吧，但是<body>元素不占据整个网页，什么是错的滚动条？
Thanks
谢谢
回答by JCOC611
overflow:scrollwill add scrollbars whether the body is bigger than the window or not. You are probably looking for overflow:auto;
overflow:scroll无论主体是否大于窗口，都会添加滚动条。您可能正在寻找overflow:auto;
回答by keithjgrant
The bodytag is kind of a special case. Most style rules applied to the bodytag apply to the whole window, regardless of tho body's "size". For the behavior you want (a scrollbar inside a box), you'll need to use a divor some other block-level element inside of the body.
该body标签是怎样的一个特例。大多数应用于body标签的样式规则适用于整个窗口，无论 thobody的“大小”如何。对于您想要的行为（框内的滚动条），您需要div在body.
回答by Hussein
You need to use overflow: auto;instead of overflow: scroll;Check it out here. http://jsfiddle.net/w6B6z/
您需要使用overflow: auto;而不是在overflow: scroll;此处查看。http://jsfiddle.net/w6B6z/
回答by Edwin Buck
The body height is not set to 100%. Even with the body height set to 100%, for this to work correctly, you need to call a few items in CSS to make it all work out cross browser.
身体高度未设置为 100%。即使将身体高度设置为 100%，为了使其正常工作，您需要在 CSS 中调用一些项目以使其在跨浏览器中都能正常工作。
Look to 100% Height Layout Using CSSfor the details.
有关详细信息，请查看使用 CSS 的 100% 高度布局。
