bootstrap网格系统填充图像

Question

我正在尝试创建一个分为2个嵌套列的列。它们都应该是覆盖其受尊重列的整个高度和宽度的图像。但是，出于某种原因，图像会越过包含它们的div。

<div class="col-lg-9 col-md-9 col-sm-9 col-xs-9">
    <div class="col-lg-5 col-md-5 col-sm-5 col-xs-5">
        <img class="fitimages" src="./images/pic1.jpg">
    </div>
    <div class="col-lg-7 col-md-7 col-sm-7 col-xs-7">
        <img class="fitimages" src="./images/pic2.jpg">
    </div>

 .fitimages{
max-width: 100%;
max-height: 100%;

}

我使用了max-width和max-height，以便它们围绕父div，但由于某种原因，左图像不会填充整个宽度和高度，而右图则覆盖它。

Answer 1

给你的img这种风格：object-fit: cover;