全屏固定背景图像滚动揭示问题

Question

我的投资组合页面上的全屏固定背景图片存在轻微问题。最重要的是两个div，一个介绍和一个描述，由一个间隙分开 - 显示背景图像。

为了创建显示图像的间隙，我只是在介绍div的底部添加了一个大的边距。在浏览器全屏时的高分辨率屏幕上，这看起来很完美，但我注意到在较低分辨率的屏幕上（或当浏览器窗口的高度减小时），背景图像似乎没有填满窗口的整个高度，因为在描述div之上添加了很多空白区域。

任何阻止这种情况发生的建议，或者是否有更好的方法来实现这种简单的效果并确保其响应将非常感激。感谢

Answer 1

这对你有用吗？它在萤火虫中看起来不错，但可能不是你想要的东西;

#appBg {
    background: url("../images/app-banner2.jpg") no-repeat fixed center center / cover rgba(0, 0, 0, 0);
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1;
}

我还建议重新拍摄背景图片，以便握住手机的手更为重要。