如何以div大小设置图像

Question

我正在电影制作网站工作并试图以相同的尺寸显示电影图像，但我有不同尺寸的图像，我需要将图像放在div中，如全尺寸，即所有四个角都应放大。请帮忙。

我的代码

<div id="movies-images"> <img class="img-fluid" src="images/a4.jpg"> </div>

CSS：

#movies-images{ width: 100%; height: 100%; }

我希望图像的宽度和高度相等。

Answer 1

试试这个：

＆＃13;

＆＃13;

.img-box {
  display: flex;
  justify-content: space-between;
}
.movies-images {
  width: 33%;
  height: auto;
}
.movies-images img {
  width: 100%;
  display: block;
}

＆＃13;

<div class="img-box">
    <div class="movies-images">
        <img class="img-fluid" src="http://lorempixel.com/800/600/">
    </div>
    <div class="movies-images">
        <img class="img-fluid" src="http://lorempixel.com/800/600/">
    </div>
    <div class="movies-images">
        <img class="img-fluid" src="http://lorempixel.com/800/600/">
    </div>
</div>

＆＃13;

＆＃13;

＆＃13;