Skip to content

Instantly share code, notes, and snippets.

@Keyes

Keyes/picture-element-example.html

Last active November 5, 2019 13:27
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save Keyes/bfe536c4796e0f01fe238da7aebd87c0 to your computer and use it in GitHub Desktop.
Save Keyes/bfe536c4796e0f01fe238da7aebd87c0 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
picture-element-example.html
<picture>
<source srcset="/images/image-496.webp, /images/image-992.webp 2x" type="image/webp" media="(min-width: 992px)" />
<source srcset="/images/image-496.jpg, /images/image-992.jpg 2x" media="(min-width: 992px)" />
<source srcset="/images/image-1000.webp, /images/image-2000.webp 2x" type="image/webp" media="(min-width: 500px)" />
<source srcset="/images/image-1000.jpg, /images/image-2000.jpg 2x" media="(min-width: 500px)" />
<source srcset="/images/image-500.webp, /images/image-1000.webp 2x" type="image/webp" />
<source srcset="/images/image-500.jpg, /images/image-1000.jpg 2x" />
<img src="/images/image-preview.jpg" />
</picture>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment