Html 定位可以在视口外溢出而不触发滚动条的元素？

我的内容和身体背景颜色是不同的，我想有一个梯度，从一个到另一个褪色。仅当内容小于视口时，才需要此效果

例如：

缩小y轴上的结果视图，注意滚动条是如何显示的，因为.footer div溢出了。我不想那样。视口应仅在内容溢出时显示滚动条。这可能吗

---

我也愿意接受其他能提供同样效果的建议动态调整内容div的大小，因此为正文设置渐变背景不起作用。

您可以将页脚定位为固定的：

<div class="footer" style="position: fixed">
</div>

（或相应地更改CSS）

---

这里有一把小提琴：

这正是我要找的。谢谢可能需要更新您的答案以指定JSFIDLE中的“固定”位置。