Skip to content

Instantly share code, notes, and snippets.

@bjankord

bjankord/gist:2702067

Created May 15, 2012 14:11
Show Gist options
  • Save bjankord/2702067 to your computer and use it in GitHub Desktop.
Save bjankord/2702067 to your computer and use it in GitHub Desktop.
Download ZIP
Picture element with Meta media variables
Raw
gistfile1.html
<head>
<meta name='media' var='small' media='min-width:320px' />
<meta name='media' var='small-2x' media='min-width:320px and min-device-pixel-ratio:2;' />
<meta name='media' var='medium' media='min-width:600px' />
<meta name='media' var='medium-2x' media='min-width:600px and min-device-pixel-ratio:2;' />
<meta name='media' var='large' media='min-width:1000px' />
</head>
<body>
<picture alt="">
<source src="/content/images/{media}/photo.jpg">
<noscript><img src="/content/images/small/photo.jpg" alt=""></noscript>
</picture>
</body>
// Notes
-----------------------------------------------------------------
This would keep <picture> short and simple and
allow for images to be served based on device size and/or device resolution.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment