Skip to content

Instantly share code, notes, and snippets.

@woodphil

woodphil/img-srcset-example.html

Created July 28, 2016 15:22
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 woodphil/0ee359f94ae4a5545a04a20cca7c1c51 to your computer and use it in GitHub Desktop.
Save woodphil/0ee359f94ae4a5545a04a20cca7c1c51 to your computer and use it in GitHub Desktop.
Download ZIP
img srcset example and comments
Raw
img-srcset-example.html
<img id="first-outfit"
srcset="small.jpg 300w,
large.jpg 1024w"
sizes="(min-width: 768px) 90vw, 100vw"
src="medium.jpg"
alt="first outfit" />
<!-- srcset defines the image sources and their dimensions -->
<!-- sizes defines the breakpoints and what the expected displays are at that break point, no media query is the default value-->
<!-- src is the default image when the queries aren't suitably matched/browser does not support srcset -->
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment