Question

我想知道一个简单的事实：

<div style="position:fixed;height:100%;width:100%;overflow:scroll">
 <div style="position:relative">Large content</div>
</div>

很好。再次（溢出在孩子的风格内）：

<div style="position:fixed;height:100%;width:100%;">
 <div style="position:relative;overflow:scroll">Large content</div>
</div>

它不会滚动。

我只是想知道一个简单的原因。有人介意告诉我吗？

Answer 1

原因是你的父母获得了窗户高度，并且仅限于此。但是，孩子的身高不受限制，所有内容都在其中可见。

例如，如果您的文本高度为2000像素，则在1920x1080的屏幕上，父级的高度为~1000px（可见区域），但子级（带内容）的高度为2000像素，不需要滚动。您只需为孩子添加height或max-height样式，即可使用滚动。

此fiddle是您的代码，包含15段lorem ipsum文本。您可以检查它以查看上述内容。

另一方面，此fiddle会向子元素添加max-height: 95%，并且可以滚动。

Answer 2

首先你应该设置一个高度如此的框架使用hight:;

作为示例：http://jsfiddle.net/XGcGw/

Answer 3

在这里：http://jsfiddle.net/9tKe3/

CSS

.fixed {
    position: fixed;
    height: 100%;
    width: 100%;
    overflow: hidden;
}

.content {
    height: 100%;
    background: red;
    overflow: auto;
}

在父div的子元素中滚动属性，其位置是固定的

3 个答案: