一尘不染

CSS:将背景图像拉伸到100%的屏幕宽度和高度吗?

css

我有一个名为myImage.jpg的图像。这是我的CSS:

body {
    background-image:url("../images/myImage.jpg");
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

由于某些原因,当我这样做时,myImage的宽度会延伸到整个屏幕,但是高度只会延伸到页面上其他所有位置的高度。所以如果我放一堆

<br>

在我的html页面中,然后高度会增加。如果我的HTML页面仅包含一个

<div id='header'>
    <br>
</div>

那么背景图片的高度就是一个的高度

<br>

如何将背景图片的高度设为用户用来查看网页的屏幕的100%?


阅读 448

收藏
2020-05-16

共1个答案

一尘不染

您需要将的高度设置html100%

body {
    background-image:url("../images/myImage.jpg");
    background-repeat: no-repeat;
    background-size: 100% 100%;
}
html {
    height: 100%
}
2020-05-16