twitter-bootstrap - Twitter 引导轮播图片

Question

我正在为 twitter 引导程序使用以下标记，但我遇到的问题是图像是左对齐的，而我希望它们位于中心。有什么明显的我错过了吗？

<div id="myCarousel" class="carousel slide">
 <ol class="carousel-indicators">
 <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
 <li data-target="#myCarousel" data-slide-to="1"></li>
 <li data-target="#myCarousel" data-slide-to="2"></li>
 </ol>
 
<!-- Carousel items -->
             <div class="carousel-inner">
             <div class="active item">
             <img src="images/karyotype2.jpg" alt=""/>
             <div class="carousel-caption">
             <h4>First Thumbnail label</h4>
             <p>Text</p>
             </div>
             </div>
             
             <div class="item">
             <img src="images/Karyotype1.jpg" alt=""/>
             <div class="carousel-caption">
             <h4>Second</h4>
             <p>Text</p>
             </div>
             </div>
             </div>
            <!-- Carousel nav -->
            <a class="carousel-control left" href="#myCarousel" data-slide="prev">&lsaquo;</a>
            <a class="carousel-control right" href="#myCarousel" data-slide="next">&rsaquo;</a>
            </div>

Answer 1

尝试将此添加到您的 CSS 中：

  .carousel-inner .item img{
   margin:0 auto; 
  }

Answer 2

我找到了一种非常简单的方法来解决这个问题，方法是添加width="100%"img 标签

<img src="images/intro1.jpg" alt="" width="100%">

我在轮播中有大图像。所以这很完美。当浏览器大小改变时，图像会自动放大或缩小。