Atributo de carregamento do HTML <img>

Etiqueta <img> do HTML

Definição e uso

loading A propriedade define se o navegador deve carregar imediatamente a imagem ou atrasar o carregamento da imagem fora da tela, até, por exemplo, o usuário rolar para perto delas.

Dica:Por favor, insira apenas loading="lazy" Adicionar à imagem localizada abaixo da tela.

Exemplo

Adicionar carregamento delayed para a imagem abaixo da tela inicial:

<img src="/i/photo/beijing.jpg" alt="北京" style="width:100%">
<img src="/i/photo/shanghai.jpg" alt="上海" style="width:100%">
<!-- Imagem fora da tela -->
<img src="/i/photo/wuhan.jpg" alt="武汉" style="width:100%" loading="lazy">
<img src="/i/photo/shanghai-1.jpg" alt="上海" style="width:100%" loading="lazy">
<img src="/i/photo/shanghai-2.jpg" alt="Shanghai" style="largura:100%" loading="lazy">
<img src="/i/photo/shanghai-3.jpg" alt="Shanghai" style="largura:100%" loading="lazy">
<img src="/i/photo/tiyugongyuan.jpg" alt="Parque Esportivo" style="largura:100%" loading="lazy">

Experimente você mesmo

Sintaxe

<img src="URL" loading="eager|lazy">

Valor do atributo

Valor Descrição
eager Padrão. Carregar imagens imediatamente.
lazy Carregar imagens com atraso até que某些条件满足。

Suporte ao navegador

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
77.0 79.0 75.0 Não suportado 64.0

Etiqueta <img> do HTML