进入全屏时背景图像会放大。

Question

我试图插入一个gif作为背景图像，但当我使页面全屏时，它会放大，使背景图像看起来大得多。当改变页面的分辨率时，是否有可能使gif保持一定的大小？

.bg {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-image: url("space.gif");
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
}

Answer 1

可以将“背景覆盖”属性更改为包含值或其他特定大小。

​

.bg {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-image: url("https://flevix.com/wp-content/uploads/2019/07/Clock-Loading.gif");
    background-size: contain;
    background-position: center;
    background-attachment: fixed;
    background-repeat:no-repeat
}

<div class="bg"></div>

​