Html 缩放图像并将其浮动成一行

我有一个最大宽度为1400px的包装器。在此

div

中有两个

img

元素宽度不同。我想使用flexbox将它们浮动成一行。它们应该适合1400px的宽度，并且看起来仍然不错，因此它们必须像图片中那样缩放（红色边框是具有1400px

最大宽度的div

）。我怎样才能解决这个问题？我希望足够清楚

.wrapper{
显示器：flex；
最大宽度：1400px；
保证金：0自动；
边框：1px纯黑；
}
img{
宽度：100%；
显示：块；
}

---

您可以将图像包装在

div

中，并调整flex属性，使其中一个比另一个大，如下所示：

.wrapper{
显示器：flex；
最大宽度：1400px；
宽度：100%；
保证金：0自动；
边框：1px纯红；
}
.首先{
高度：300px；
弹性：2；
位置：相对位置；
边框：1px实心#000；
}
.第二{
高度：300px；
弹性：1；
位置：相对位置；
边框：1px实心#000；
}
img{
位置：相对位置；
身高：100%；
宽度：100%；
}

---

可能的解决方案是的，但我必须使用img元素……所以这并不能真正解决我的问题。