【问题标题】:How to lazy load an image in CSS如何在 CSS 中延迟加载图像
【发布时间】:2021-04-02 17:32:19
【问题描述】:
.image--about {
    background: url(../img/ZIZF.gif) no-repeat center;
    background-size: cover
}

我有这个 CSS。我想对通过 CSS 加载的以下图像使用延迟加载,您能帮帮我吗?

【问题讨论】:

    标签: html css seo lazy-loading


    【解决方案1】:

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

    可以使用 HTML
    <img src="myimage.jpg" loading="lazy" alt="..." />
    

    用于加载的其他值,例如 eagerauto

    其他方法需要 JavaScript 检查这个? Five Ways to Lazy Load Images for Better Website Performance

    【讨论】:

    • 嘿,我已经尝试在图像中添加以下属性,但我只想将它添加到 css 中,我的图像通过 css 加载,如果你能帮助我的话
    • 我正在寻找它,但到目前为止,现在有办法通过 css 加载图像,只有包含 JavaScript 的 servals 方法和我在回答中提到的单一方法
    • 查看更多信息web.dev/lazy-loading-images
    猜你喜欢
    • 1970-01-01
    • 2020-08-12
    • 2023-03-07
    • 2016-05-15
    • 1970-01-01
    • 1970-01-01
    • 2014-06-05
    • 1970-01-01
    • 2023-03-22
    相关资源
    最近更新 更多