【发布时间】:2016-03-23 19:04:58
【问题描述】:
我对放置在轮播中的图像尺寸有疑问。我加载的任何图像(具有不同尺寸 px)我都会得到一个在整个旋转宽度上拉长的图像,并且与原始图像不成比例。 我应该如何修复 CSS ?我可以将图像放置在轮播的中心而不将其延长到左/右边界吗?这是我的 CSS:
.carousel {
height: 500px;
margin-bottom: 10px;
}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
z-index: 100;
}
/* Declare heights because of positioning of img element */
.carousel .item {
height: 500px;
background-color: #FFF;
}
.carousel-inner > .item > img {
position: center;
top: 0;
left: 10;
min-width: 100%;
height: 500px;
}
【问题讨论】:
-
我在我的页面和“项目”部分使用轮播:
<div class="carousel-inner" role="listbox" style='height:450px;'> <div class="item col-lg-10 col-lg-offset-1 active" style="height:440px;">...</div> <div class="item col-lg-10 col-lg-offset-1" style="height:440px;">...</div>用于将项目 div 定位在中心并控制宽度,一切正常。 -
这个问题可能会有所帮助:stackoverflow.com/questions/19481334/…
标签: css twitter-bootstrap carousel