尝试找出一种方法，使竖屏和横屏图片根据最大高度和最大宽度的情况自适应视口大小。只要宽度不超过1050像素，图像就应该保持100％的宽度。另一个限制是图像最多应为800像素高。所以先遇到哪个“真实”条件，就应该限制图像的大小。如果我设置
max-width: 1050px和max-height: 800px;，那么图像的纵横比就会被破坏（如下面的演示所示）。还有一个问题是图像的宽度将比实际图像更宽（836像素宽的竖屏图像会缩放到1050像素）。这是否可能仅使用CSS控制？演示