@0xabdulkhaliq
Posted
Hello there π. Congratulations on successfully completing the challenge! π
- I have other recommendations regarding your code that I believe will be of great interest to you.
iMAGES πΈ:
- You can use the
<picture>
tag instead of settingimages
to background when you have different versions of the sameimage
. The<picture>
HTML element contains zero or more<source>
elements and one<img>
element to offer alternative versions of an image for different display/device scenarios.
- Using the <picture> tag will help you to load the correct image for the user's device saving bandwidth and improving performance. You can read more about this here.
Example :
<picture>
<source media="(max-width: 500px)" srcset="./images/image-product-mobile.jpg">
<img src="./images/image-product-desktop.jpg" alt="alt text goes here">
</picture>
.
I hope you find this helpful π Above all, the solution you submitted is great !
Happy coding!
Marked as helpful