Design comparison
SolutionDesign
Solution retrospective
A useful HTML element to load different images based on media, pixel density or image type (webp, avif, etc).
<picture>
<source srcset="/image-desktop.jpg" media="(min-width: 50em)">
<img src="/image-mobile.jpg" alt="" >
</picture>
More about picture element from MDN website.
Community feedback
- @snehamoybagPosted over 2 years ago
Wow it looks exactly like the design great job! And thanks for the tip.. I had no idea you can do that in html 😳
1
Please log in to post a comment
Log in with GitHub
Join our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord