我正在使用Bootstrap 4.我有一个带图片的旋转木马。图像继续显示拉伸。 Idk是什么问题。
.carousel { margin-bottom:4rem; 位置:相对;}
.carousel -…
你可以chnage img height yo auto的值
.carousel-inner img { position: absolute; top: 0; left: 0; height: auto object-fit: containt !important; display: block; }
或者添加宽度auto并保持高度值:
.carousel-inner img { .... height: 32rem; .... width : auto; /* or 100% */ }
而不是使用 object-fit: contain !important; 你尝试过使用过吗? object-fit: cover !important; 达到你想要的效果?
object-fit: contain !important;
object-fit: cover !important;
我假设您想要将背景放置在从左到右以及从上到下覆盖而不会变形图像的位置?为此,我使用 background-size: cover; 要么 object-fit: cover; 。
background-size: cover;
object-fit: cover;