在引导程序myCarousel中拉伸的图像

时间:2019-04-16 20:49:26

标签: carousel slideshow

我正在为一个客户做网站,它在主页和全视图上使用myCarousel,幻灯片图像很好,但在移动视图上,图像由于高度而垂直拉伸:180像素;幻灯片图像有3-5行标题,因此放进固定的高度,但是客户说它们是拉伸的,所以我放了适合的对象:封面用哪种方法解决了拉伸的问题,但在任一侧都切断了图像,客户对此不满意,我尝试了img-response,它再次解决了问题,但字幕不适合。我不知道该怎么做,我认为没有什么可以做的,有人可以帮忙吗?

enter image description here

1 个答案:

答案 0 :(得分:0)

更新:认为我已经使用以下CSS解决了它

.carousel-inner > .item > img {
height: 180px;
object-fit: cover;
width: 100%;
object-position: right center;
}    
.carousel-inner > .item:nth-of-type(7) > img {
height: 180px;
object-fit: cover;
width: 100%;
object-position: left center;
}
.carousel-inner > .item:nth-of-type(9) > img {
height: 180px;
object-fit: cover;
width: 100%;
object-position: left center;
}
.carousel-inner > .item:nth-of-type(10) > img {
height: 180px;
object-fit: cover;
width: 100%;
object-position: left center;
}
.carousel-inner > .item:nth-of-type(12) > img {
height: 180px;
object-fit: cover;
width: 100%;
object-position: left center;
}

似乎已经使用了该CSS