html - 除了在动画背景中使用 .gif 图像之外，还有其他选择吗？

Question

我现在正在建立一个非常简单的网站，现在我正在使用 .gif 图像作为动画背景。

body, html{
    background-image: url("http://i.imgur.com/3F7rneL.gif");
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center;
    background-size: cover;
}

它可以工作，但我确定加载背景需要一些时间，所以我尝试将 gif 更改为 gifv 但它不起作用。

是否有任何其他选择可以将此动画作为背景？

Answer 1

另一种方法是同时使用背景图像和背景颜色，这会导致背景颜色渲染，直到您的图像加载为止(例如相似的颜色以某种方式不会扭曲设计)

使用背景图片和颜色:

yourselector{
     background: #ccc url('images/yourgif.gif');
}

或者在您的代码中添加 background-color 属性。

这只是一个选项。