HTML <img> loading eigenschap

HTML <img> tag

Definitie en gebruik

loading Deze eigenschap bepaalt of de browser de afbeelding onmiddellijk moet laden of de afbeelding buiten het scherm moet uitstellen tot bijvoorbeeld de gebruiker er naartoe scrolt.

Tip:Gebruik alleen loading="lazy" Voeg toe aan de afbeelding onder het scherm.

Voorbeeld

Voeg een uitgestelde laadtijd toe aan de afbeelding onder het startscherm:

<img src="/i/photo/beijing.jpg" alt="北京" style="width:100%">
<img src="/i/photo/shanghai.jpg" alt="上海" style="width:100%">
<!-- Afbeelding buiten het scherm -->
<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="width:100%" loading="lazy">
<img src="/i/photo/shanghai-3.jpg" alt="Shanghai" style="width:100%" loading="lazy">
<img src="/i/photo/tiyugongyuan.jpg" alt="Sports Park" style="width:100%" loading="lazy">

Try It Yourself

Syntax

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

Attribute Value

Value Description
Eager Default. Load images immediately.
Lazy Lazy load images until certain conditions are met.

Browser Support

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
77.0 79.0 75.0 Not supported 64.0

HTML <img> tag