Bootstrap Carousel宽度比图片大

Question

我在Bootstrap中使用旋转木马来实现滑动图片效果，但是当窗口宽度变大时，幻灯片盒变大，而图片区域的宽度保持原始。

当图片的宽度过大时，如何修改代码将框的左边距放到图片的左边缘？

编辑：演示地址：http://zgzhen.freeshell.ustc.edu.cn/posters/nctu2013

我想要的效果：旋转木马盒的自动调整大小，使右侧的控制面板不会超出范围。

<ol class="carousel-indicators">
<li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
<li data-target="#carousel-example-generic" data-slide-to="1"></li>
<li data-target="#carousel-example-generic" data-slide-to="2"></li>
<li data-target="#carousel-example-generic" data-slide-to="3"></li>
</ol>

<div class="carousel-inner">
<div class="item active">
  <img src="../images/upload/nctu/1.png" alt="...">
</div>
<!-- other pictures-->
</div>
<!-- Controls -->
<a class="left carousel-control" href="#carousel-example-generic" data-slide="prev"></a>
<a class="right carousel-control" href="#carousel-example-generic" data-slide="next"></a>
</div></div>

Answer 1

您的问题不够明确，您想要居中图像还是想要填充图像。请尝试这个并告诉我更多帮助。将以下代码粘贴到CSS样式表中。

.carousel-inner .item img{
    width: 100%;
}