Bummer! This is just a preview. You need to be signed in with an account to view the entire instruction.
- Using the \<img\> Element with srcset and sizes Attributes
- Using the \<picture\> Element to Display Different Images for Different Viewport Sizes
- Displaying Images in Alternative Formats with the \<picture\> Element
- Optimizing Images for Responsive Web Design: Techniques for Different Viewport Sizes Quiz 5 questions
Well done!
You have completed (UPI) Chapter 5: Image Manipulation in HTML!
Instruction
Using the \<img\> Element with srcset and sizes Attributes
The <img> element can serve different image sizes for various viewport conditions by specifying multiple images in the srcset attribute. The sizes attribute allows you to define when each image size should be used based on the viewport width.
Example Code:
<img
src="images/mountains_medium.png"
`alt="mountains"`
srcset="images/mountains_large.png 800w,
imag...