Адаптивное изображение в полноэкранном режиме и по центру — сохраняйте соотношение сторон, не выходя за пределы окна. ⇐ CSS

[Anonymous]

Поэтому я хочу, чтобы img отображался

• как можно больше (заполняя ширину, когда это альбомная ориентация, и высоту, когда она портрет)
• без обрезки
• без перекоса или растяжения (исходное соотношение сторон)
• центрировано как по вертикали, так и по центру горизонтально

Кроме того, оригинальное изображение размер неизвестен.
Я попробовал несколько разных вариантов, в том числе флексбокс (чтобы получить вертикальный центр), но, похоже, ни один из них не соответствует всем требованиям.< /p>
Конечно, в идеале я бы хотел, чтобы это было решение, полностью использующее CSS, но я также рассматриваю возможность использования JS.

Подробнее здесь: https://stackoverflow.com/questions/184 ... -exceed-wi