У меня есть ситуация, когда я не могу знать размеры изображения (проприетарная ограниченная cms ...)

Мне нужно выяснить, как показать изображение уровня сетчатки, и я хочу сделать это без использования JavaScript (если это возможно).

Я использовал:

@media only screen and (-webkit-min-device-pixel-ratio: 2) {}

но это только помогло мне с элементами, которые имеют фоновые изображения. Поскольку рассматриваемое изображение не может быть фоновым изображением (поскольку я не знаю его размера ...), как это можно выяснить?

я имеюlogo.png а такжеlogo2x.pngи моя применимая разметка выглядит примерно так:

<h1 id="logo">
  <a href="/">
    <img src="images/logo.png">
  </a>
</h1>

Возможно ли это без JavaScript? Я не против использования нестандартного css для этого - до тех пор, пока он работает с webkit (в данном случае ios / iphone). Я хочу показатьlogo.png для обычных браузеров, ноlogo2x.png для браузеров с соотношением пикселей не менее 2.