Attributo loading di HTML <img>
Definizione e uso
loading
L'attributo specifica se il browser deve caricare immediatamente l'immagine o ritardare il caricamento delle immagini fuori schermo fino a quando, ad esempio, l'utente non scorre verso di esse.
Suggerimento:Aggiungi solo loading="lazy"
Aggiungi all'immagine situata sotto lo schermo.
Esempio
Aggiungi un caricamento ritardato all'immagine inferiore della schermata principale:
<img src="/i/photo/beijing.jpg" alt="北京" style="width:100%"> <img src="/i/photo/shanghai.jpg" alt="上海" style="width:100%"> <!-- Immagine fuori schermo --> <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="larghezza:100%" loading="lazy"> <img src="/i/photo/shanghai-3.jpg" alt="Shanghai" style="larghezza:100%" loading="lazy"> <img src="/i/photo/tiyugongyuan.jpg" alt="Parco sportivo" style="larghezza:100%" loading="lazy">
Sintassi
<img src="URL" loading="eager|lazy">
Valore dell'attributo
Valore | Descrizione |
---|---|
eager | Predefinito. Carica immediatamente l'immagine. |
lazy | Carica l'immagine in ritardo fino a quando non vengono soddisfatte alcune condizioni. |
Supporto del browser
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Chrome | Edge | Firefox | Safari | Opera |
77.0 | 79.0 | 75.0 | Non supportato | 64.0 |