html - 如何在 CSS 中延迟加载图像

Question

.image--about {
    background: url(../img/ZIZF.gif) no-repeat center;
    background-size: cover
}

我有这个 CSS。我想使用延迟加载来跟踪我通过 CSS 加载的图像，你能帮我吗？

Answer 1

我不知道是否可以通过 css 应用延迟加载，但可以使用 HTML 通过添加单个属性 loading="lazy"

<img src="myimage.jpg" loading="lazy" alt="..." />

其他加载值，如 eager和 auto其他方法将需要 JavaScript 检查此 👉 Five Ways to Lazy Load Images for Better Website Performance