标题有点误导，因为简单地保持宽高比和html元素是微不足道的，使用宽度和填充底部或填充顶部百分比。但是，我的情况有点不同。也许解决方案同样微不足道，但我的大脑却被炸了。
所以在我的情况下，我在容器div中有一个内容div。假设容器div可以具有任何尺寸和大小。要求是内部div需要保持它自己的宽高比，但还需要适合容器div的高度或宽度，无论哪个更接近于内容div的宽高比。
例如，我的内容div的宽高比为16：9。我的容器div目前宽500px，高1000px。在这种情况下，我的内容div将自己调整为500px宽和281px高，内容div上方和下方的空白区域。现在容器div可能被调整为1000px宽和500px高，在这种情况下，内容div将自己调整为889px宽度和500px高度，内容div的左侧和右侧有空白。
解释这种情况可能是一种不那么复杂的方式，但同样，我的脑子今天也在炒。任何帮助将不胜感激。
编辑：我正在寻找一个仅限CSS的解决方案。我知道JS / JQuery可以实现这一点。答案 0 :(得分：0)
您想要做的是使用像object-fit: cover之类的东西来获得最佳效果。不幸的是，在这种情况下，只有CSS的解决方案不会产生预期的结果，如上所述，需要JavaScript / jQuery。