我们可以给旋转木马里的项目设置一个统一的高度 .. 在它的包装元素上再添加一个 demo ...

然后打开自定义的样式 .. 设置一下 .carousel.demo 下面的 .carousel-item 的样式 .. 把 height 设置成 300px ..

再去试一下 .. 现在幻灯片的项目都会有一个固定的统一的高度 ..

调整一下浏览窗口的大小 .. 在小尺寸的浏览窗口上面，你会发现这个幻灯片的显示还有点问题 ..

再回到自定义的样式 .. 这里我们需要再去设置一下 .carousel-demo 下面的 .carousel-item 下面的 img 元素的样式 ..

把 min-height 设置成 300px ，再把它的 max-height 设置成 400px .. 就是设置一下图像的最小还有最大的高度 ..

设置图像的高度会改变图像的显示比例，如果想保持图像原有的比例，我们可以再把 object-fit 设置成 cover ...

然后再去预览一下 ..

现在，不管浏览窗口是多大 .. 旋转木马组件都可以很好的显示 ..