Interview Question

What is lazy loading in CSS?

Lazy resource loading is mainly an HTML/browser feature; CSS can reduce some rendering work.

💡 Concept ✅ Quick Revision 🎨 CSS

Answer

CSS does not provide a general lazy-loading attribute for images or other HTML resources. • HTML uses attributes such as `loading="lazy"` for supported images and iframes. • CSS background images may still be requested when matching rules require them. • CSS tools such as content-visibility can skip some off-screen rendering work but do not replace HTML lazy loading.

💡 Simple Example

.offscreen-section { content-visibility: auto; contain-intrinsic-size: auto 30rem; }

⚡ Quick Revision

Lazy resource loading is mainly an HTML/browser feature; CSS can reduce some rendering work.