最大高さと最大幅のシナリオで、縦向きと横向きの画像をビューポートのサイズに合わせて調整する方法を見つけようとしています。
幅が 1050px を超えない限り、画像は 100% の幅を維持する必要があります。もう 1 つの制約は、画像の高さが最大 800 ピクセルであることです。したがって、どちらが最初に「true」になるかによって、画像のサイズが制限されます。
設定するmax-width: 1050pxとmax-height: 800px;、画像の縦横比が台無しになります。(以下のデモで見られるように)。また、画像の幅が実際の画像よりも広くなるという問題もあります (幅 836px の縦長の画像が 1050px にアップスケールされます)。これはCSSだけで制御できますか？