如果移动屏幕处于横向状态，如何使背景图像保持在底部？

Question

我正在开发一个 Angular 应该是移动响应的 Web 应用程序。背景图像必须始终位于底部。除了横向的移动设备外，我使所有尺寸的设备都可以做到这一点。

我尝试在 Stack Overflow 中研究样本。我试过了，但它只适用于其他设备，这很好，但不适用于我遇到的横向问题。

:host {
    display: block;
    position: absolute;
    height: 100%;
    background-image: url(../../../assets/images/...);
    background-position: center bottom;
    background-attachment: fixed;
    background-repeat: no-repeat;
}

发生的情况是，就视口的高度而言，背景图像仅位于底部。它应该位于页面底部，包括页面的滚动高度（因为视图是横向的）。

Answer 1

您是否尝试过使用背景图片定位 body 标签？

body {
    background-image: url(../../../assets/images/...);
    background-position: center bottom;
    background-attachment: fixed;
    background-repeat: no-repeat;
}

如果移动屏幕处于横向状态，如何使背景图像保持在底部？

How to keep the background image stick at the bottom if the mobile screen is on landscape?

css

responsive-design

responsive