我在应用程序中有固定页脚。 当内容比屏幕高度大时，它会为其添加一个滚动条。但我无法看到内容的结尾，因为它位于页脚的下方，并且页脚被固定不允许我滚动或查看它。
请注意：页脚的高度实际上是未知的，我有其他固定的div创建在页脚运行时之上。所以内容应该可以在底部的所有固定div上滚动。使可变高度的固定页脚滚动整个内容
JS捣鼓相同：https://jsfiddle.net/wfck8y8n/
在小提琴以下代码获取由于固定页脚的隐藏。
<div>I might get hidden because of footer</div>
如何使这只是使用CSS可见？
将所有内容放入内容包装并将高度定义为80vh（因为页脚为20vh）。
body {
padding: 0;
}
#footer {
position: fixed;
bottom: 0;
background-color: black;
color: white;
width: 100%;
height: 20vh;
}
.content {
height: 80vh;
}
.content div {
min-height: 120px;
}<div class="content">
<div>Content</div>
<div>Content</div>
<div>Content</div>
<div>Content</div>
<div>Content</div>
<div>I might get hidden because of footer</div>
<div>I might get hidden because of footer</div>
<div>I might get hidden because of footer</div>
</div>
<div id="footer">
I am footer
</div>页脚的高度实际上是未知的，我有其他固定的div创建在页脚运行时的上方。我将在问题中更新相同的 –
你需要的是作为内容越吹推页脚：
html, body {
height: 100%;
}
.wrapper {
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto -20vh; /*the bottom margin = -(footer's height)*/
}
.push, #footer {
height: 20vh;
}
#footer {
position : fixed;
bottom : 0;
background-color : black;
color : white;
width : 100%;
}
.content div{
min-height: 120px;
}<div class="wrapper">
<div class="content">
<div>Content</div>
<div>Content</div>
<div>Content</div>
<div>Content</div>
<div>Content</div>
</div>
<div>I might get hidden because of footer</div>
<div>I might get hidden because of footer</div>
<div>I might get hidden because of footer</div>
<div class="push"></div>
</div>
<div id = "footer">
I am footer
</div>我想实现这可能是由除页脚div所有部分包裹的最简单方法，然后添加到封装一个margin-bottom规则，该规则以像素为单位表示页脚的高度。
我做了一个Codepen demo，我希望它有帮助。
将填充添加到与固定页脚相同高度（或更高）的内容底部。 –
将'padding-bottom：20vh;'（与页脚高度相同）添加到'body' –
向内容添加填充底部，以便页脚仅覆盖填充。 – Nekomajin42