究其原因，是因为 body 的线性渐变高度设置了整个 body 的大小，我们调整一下渐变的高度：
body {background-image:
linear-gradient(to right top, #ffcc00 50%, #eee 50%);
background-size: 100% calc(100% - 100vh + 5px);
background-repeat: no-repeat; }
这里使用了 calc 进行了运算，减去了 100vh，也就是减去一个屏幕的高度，这样渐变刚好在滑动到底部的时候与右上角贴合。
而 + 5px 则是滚动进度条的高度，预留出 5px 的高度。再看看效果，完美：
声明 本文摘取字 掘金 作者chokcoco，个人觉得很有帮助拿出来分享一下，并非原创作品。
原文链接：https://juejin.im/post/5c35953ce51d45523f04b6d2