Twitter bootstrap 保持图像纵横比的引导旋转木马

我的网站上有一个引导转盘。 在较小的屏幕上调整大小时，我希望保持图像纵横比。如何做到这一点

下面是一些代码：

<!-- Carousel
================================================== -->
<div id="myCarousel" class="carousel slide">
  <div class="carousel-inner">
    <div class="item active">
      <img src="img/bg_good_sex2.jpg" class="img-responsive" alt="verslaafd-aan-porno-goede-seks">
      <div class="container">
        <div class="carousel-caption">
          <h1>Sex Coach <span class="text-primary"> App
          </span></h1>
          <p>Krijg controle op porno- of seksverslaving</p>
          <p><a href="<?php echo SSL_DOCUMENT_ROOT ?>/register.php" class="btn btn-lg btn-primary"><i class="icon-chevron-sign-right"></i> <?php echo START_BTN ?></a></p>
          <p><a href="<?php echo SSL_DOCUMENT_ROOT ?>/survey_me.php" class="btn btn-success btn-primary btn-lg"><i class="icon-edit"></i> <?php echo BTN_SURVEY_ME ?></a></p>
        </div>
      </div>
    </div>
  </div>
</div><!-- /.carousel -->

性爱教练应用程序
Krijg控制色情作品-塞克斯维斯林

谢谢,，

---

Fred

将以下样式添加到

中。这将在大型浏览器上保持纵横比

max-width: 100%;
width: auto;
height: auto;
vertical-align: middle;

---

另一种选择是将

与背景图像一起使用，并使用

背景大小：封面
我已经尝试了上述答案和许多其他答案，但运气不佳，但通过使用chrome开发工具，我想出了这个简短的解决方案。希望这也适用于您：

/* Carousel image resize */
.carousel-inner > .item > a > img,  .carousel-inner > .item > img {
    width: 100%;
} 

使用与上述相同类的精确代码很重要
您是否可以添加读者可能会帮助您的转盘的简化版本。可能与：@MikeCauser有关，此解决方案具有固定的500px高度。我希望容器的全部内容（图像和文本）在较小的显示器上缩小。