设置纵向屏幕的背景图像

Question

问题是div占据屏幕的90％并显示背景图像。 CSS是：

div.invite-bg {
    background-image:url('../img/b1g.jpg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 92em 52em;
    display: compact;
    width: 100%;
    height: 90%;
    position: absolute;
    top: 10%;
    left:0;
}

它的高度在iPad或iPhone的纵向屏幕中不起作用。我该如何解决这个问题？

Answer 1

你使用display：compact，这让我觉得你得到的元素显示为内联元素。尝试将其更改为显示：block;

使用display：compact的元素可以显示为内联元素或块元素，具体取决于以下元素。

Answer 2

您可以尝试将背景尺寸调整为cover或contain。

可以找到更多详细信息here。