Можно ли встроить правила CSS @media в строку?

Мне нужно динамически загружать изображения баннеров в приложение HTML5, и я хотел бы иметь несколько разных версий, соответствующих ширине экрана. Я не могу правильно определить ширину экрана телефона, поэтому единственный способ сделать это — добавить фоновые изображения div и использовать @media для определения ширины экрана и отображения правильного изображения.

Например:

 <span style="background-image:particular_ad.png; @media (max-width:300px){background-image:particular_ad_small.png;}"></span>

Возможно ли это, или у кого-нибудь есть другие предложения?