Skip to content

Embed URL

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
ALA Image Snippets
<figure><img src="<!-- URL here -->" alt=""></figure>
<figure>
<img src="<!-- URL here -->" alt="">
<figcaption>Image description goes here.</figcaption>
</figure>
<figure>
<picture>
<source media="(min-width: 600px)"
srcset="<!-- URL for high-DPI image here --> 2x" >
<img src="<!-- URL for standard image here -->" alt="">
</picture>
</figure>
<figure>
<picture>
<source media="(max-width: 700px)"
srcset="<!-- URL for small-screen image here --> 1x,
<!-- URL for small-screen, high-DPI image here --> 2x" >
<source media="(min-width: 600px)"
srcset="<!-- URL for high-DPI image here --> 2x" >
<img src="<!-- URL for standard image here -->" alt="">
</picture>
</figure>
<figure>
<img src="<!-- SVG URL here -->" data-fb="<!-- fallback URL here -->" onerror="this.src = this.getAttribute('data-fb');">
</figure>
@murtaugh
Owner

ALA uses Filament Group's picturefill to serve high-DPI and small-screen options.

@murtaugh
Owner

Removing all tabs and extra whitespace for the same of EE's sanity.

@murtaugh
Owner

Fixed the width logic in example 4.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.