Html 只在一个 div 内滚动，而网站保持定位
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7633392/
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
Only scrolling inside one div, while website stays positioned
提问by 45808
I'm trying to create a website with the following.
我正在尝试使用以下内容创建网站。
On top there's just a basic horizontal menu. Below that, on the left side, is another subcategory. The content will be on the right of the subcategory and can be very long.
顶部只有一个基本的水平菜单。在其下方，左侧是另一个子类别。内容将位于子类别的右侧，并且可能很长。
Now what I would like is that when you scroll anywhere on the page, it only scrolls the content div while everything else stays at its original position. I have been thinking about it for some hours now but I cannot really come up with a solution on how to do this.
现在我想要的是，当您在页面上的任何位置滚动时，它只会滚动内容 div，而其他所有内容都保持在其原始位置。我已经考虑了几个小时，但我无法真正想出如何做到这一点的解决方案。
<html>
<head>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="container">
<div class="left_side"></div>
<div class="right_side"></div>
</div>
</body>
</html>
.container {
width:1000px;
}
.left_side {
float:left;
width:250px;
height:500px;
background:green;
}
.right_side {
float:right;
width:750px;
height:1500px;
background:yellow;
}
Any idea on how to do this? Thanks in advance.
关于如何做到这一点的任何想法？提前致谢。
回答by 45808
Answer was given by @jao's comment. Setting all divs, except for the content one, to position: fixed.
@jao 的评论给出了答案。将除内容 1 之外的所有 div 设置为position: fixed.
回答by Moo-Juice
Add the overflow:autostyle to its class.
将overflow:auto样式添加到其类中。
Full explanation: http://www.w3schools.com/cssref/pr_pos_overflow.asp
