W3C home > Mailing lists > Public > public-html@w3.org > September 2013

Re: New responsive images proposal

From: Jukka K. Korpela <jukka.k.korpela@kolumbus.fi>
Date: Fri, 27 Sep 2013 23:04:26 +0300
Message-ID: <5245E4CA.8030808@kolumbus.fi>
To: public-html@w3.org
2013-09-27 22:42, Brendan Long wrote:
> Sorry if this is a stupid question, but the use of media queries in the
> src attribute brings up an interesting question: Why don't we just let
> the src attribute be specified by CSS?
>
> <img alt="A cat" src="default-cat.jpeg" class="cat" />
>
> img.cat {
>      @media (max-width: 600px) {
>          src: "smaller-cat.jpeg";
>      }
>      @media (max-width: 400px) {
>          src: "even-smaller-cat.jpeg";
>      }
> }
>

That way, the approach would deviate quite a lot from the overall 
structure of CSS. You don’t set element attributes in CSS, and you don’t 
use @media queries inside rules. I’m not saying this would impossible, 
just that it would probably be too different from design principles 
applied so far.

But there’s a different approach to implementing a similar idea. Just 
use @media queries as currently defined and implemented, and use CSS 
code like

@media (max-width: 600px) {
   img.cat { content: url(smaller-cat.jpeg) }
}

This is currently defined only in the CSS3 Generated Content Module, a 
very old WD (from 2003), but this part of it has been implemented in 
Opera, Safari, and Chrome.

-- 
Yucca, http://www.cs.tut.fi/~jkorpela/
Received on Friday, 27 September 2013 20:04:49 UTC

This archive was generated by hypermail 2.4.0 : Saturday, 9 October 2021 18:46:05 UTC