html picture tag code example

Example 1: img tag html

<img src="peng_ting.jpg" alt="peng ting" width="500" height="600">

Example 2: picture html

<picture>
 <source srcset="mdn-logo-wide.png" media="(min-width: 600px)">
 <img src="mdn-logo-narrow.png" alt="MDN">
</picture>

Example 3: img tag

<img src="the source image's url" alt="the image's description">

Example 4: img tag

<img src="photo1.png" alt="">

Example 5: picture tag how to set size for each of the pictures

<img src="image-small.png"
    srcset="image-small.png 320w, image-medium.png 800w, image-large.png 1200w"
    sizes="80vw"
    alt="Image description">

Example 6: picture and img tag

<img srcset="image-400.jpg 400w,
             image-800.jpg 800w,
             image-1600.jpg 1600w"
     sizes="(min-width: 1280px) 600px,
            (min-width: 768px) 500px,
            100vw"
     src="image-800.jpg"
     alt="Munster Dom">