如何使div全屏显示和可滚动？ [英] How to make a div full screen and scrollable?

问题描述

使用绝对值时，它会滚动但不会达到100％的高度：

With absolute, it scrolls but doesn't get 100% in height:

.class {
 position: absolute;
 left: 0;
 right: 0;
 top: 0;
 bottom: 0;
 height: 100%;
 width: 100%;
 z-index: 1000000;
 background: rgba(0, 0, 0, 0.9);
}

固定后，它的高度为100％，但不会滚动

With fixed, it gets 100% in height but doesn't scroll

.class {
 position: fixed;
 left: 0;
 top: 0;
 height: 100%;
 width: 100%;
 z-index: 1000000;
 background: rgba(0, 0, 0, 0.9);
}

我想避免向子元素添加固定的高度并使其固定溢出：滚动

I would like to avoid adding a fixed heigth to the child element and make it overflow: scroll

推荐答案

您需要添加 overflow：auto ，以便在内容溢出容器时滚动。

You need to add overflow:auto so that it scrolls if the content overflows the container.

.class {
    ...
    overflow:auto;
}

http://jsbin.com/kuqaqumude/1/edit?html,css,output

有关溢出：自动和溢出：可见，

的更多详细信息，请参见：
http://www.w3.org/TR/CSS21 /visufx.html#overflow-clipping

这篇关于如何使div全屏显示和可滚动？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！