<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
</head>
<body>
<h2>Example</h2>
<img src="https://i.pinimg.com/originals/c7/93/ae/c793ae372886c450d55535211231204e.jpg" alt="Nature" width="400" height="700">
</body>
</html><picture>
<source media="(min-width: 1280px)" srcset="large.jpg">
<source media="(min-width: 640px)" srcset="medium.jpg">
<img src="small.jpg" alt="サンプル">
</picture><img src="img.img" alt="" height="" width=""><img src="/images/sunset.jpg" alt="Picture of a Ha Long Bay sunset"><img src="photo1.png" alt=""><picture>
<source srcset="mdn-logo-wide.png" media="(min-width: 600px)">
<img src="mdn-logo-narrow.png" alt="MDN">
</picture>
<img src="" alt=""><picture>
<source media="(max-width: 799px)" srcset="elva-480w-close-portrait.jpg">
<source media="(min-width: 800px)" srcset="elva-800w.jpg">
<img src="elva-800w.jpg" alt="Chris standing up holding his daughter Elva">
</picture><picture>
<source srcset="logo-768.png 768w, logo-768-1.5x.png 1.5x">
<source srcset="logo-480.png, logo-480-2x.png 2x">
<img src="logo-320.png" alt="logo">
</picture><picture>
<source type="image/webp" srcset="images/butterfly.webp">
<img src="images/butterfly.jpg" alt="a butterfly">
</picture><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"><!--Change the browser window width to see the image change.-->
<picture>
<source srcset="/media/cc0-images/surfer-240-200.jpg"
media="(min-width: 800px)">
<img src="/media/cc0-images/painted-hand-298-332.jpg" alt="" />
</picture>