[whatwg] <imgset> responsive imgs proposition (Re: The src-N proposal)

[Christian Biesinger]

On Tue, Nov 12, 2013 at 3:06 PM, Markus Ernst <derernst at gmx.ch> wrote:
> What I don't like about CSS approaches is the fact that changing the source
> of an image is fundamentally different from changing a dimension or color of
> an element. This is not "presentational" in the same way. Having to
> reference content images in the CSS in order to change their sources is an
> authoring nightmare.

For a bit more presentation, and while we're inventing new syntax
anyway, how about this:

<style>
@media (min-width: 480px) {
  .artdirected { content: replaced url(attr(src-small)); }
}
@media (min-width: 600px) {
  .artdirected { content: replaced url(attr(src-medium)); }
}
@media (min-width: 800px) {
  .artdirected { content: replaced url(attr(src-big)); }
}
</style>
...
<img class="artdirected" src="foo.jpg" src-small="foo-small.jpg"
src-medium="foo-medium.jpg" src-big="foo-big.jpg">

-christian