Свойство loading тега HTML <img>
Определение и использование
loading Свойство определяет, должен ли браузер немедленно загружать изображение или отложить загрузку изображений за пределами экрана, до тех пор, пока, например, пользователь не прокрутит их附近.
Совет:Пожалуйста, добавьте только loading="lazy" Добавить к изображению, расположенному под экраном.
Пример
Добавить задержку загрузки изображений на нижний экран:
<img src="/i/photo/beijing.jpg" alt="北京" style="width:100%"> <img src="/i/photo/shanghai.jpg" alt="上海" style="width:100%"> <!-- 外屏外的图像 --> <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="Шанхай" style="ширина:100%" loading="lazy"> <img src="/i/photo/shanghai-3.jpg" alt="Шанхай" style="ширина:100%" loading="lazy"> <img src="/i/photo/tiyugongyuan.jpg" alt="Спортивный парк" style="ширина:100%" loading="lazy">
синтаксис
<img src="URL" loading="eager|lazy">
значение свойств
| значение | описание |
|---|---|
| eager | по умолчанию. Загрузка изображений сразу. |
| lazy | Загрузка изображений с задержкой до тех пор, пока не будут выполнены某些 условия. |
Поддержка браузеров
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Opera |
| 77.0 | 79.0 | 75.0 | Не поддерживается | 64.0 |
