css - Twitter Bootstrap轮播

我已经在我的网页上实现了轮播，如下所示

<div class="container-fluid">

            <div id="myCarousel" class="carousel slide">
                <!-- Carousel items -->
                <div class="carousel-inner">
                <div class="active item">
                    <img src="/public/images/Lighthouse.jpg">
                </div>
                <div class="item">
                    <img src="/public/images/Lighthouse.jpg">
                </div>
                <div class="item">
                    <img src="/public/images/Lighthouse.jpg">
                </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><!--End of Carousel-->

我希望它保持响应状态，目前它是随着屏幕变小而调整图片。但是，轮播会填充整个页面（宽度），我希望将其缩小并放在页面的中央。我给了.carousel宽度，但这似乎影响了响应速度。

有谁知道如何自定义此插件或过去做过此事

任何帮助表示赞赏

谢谢

最佳答案

媒体查询解决了这个问题，因为我给轮播设置了宽度

@media (max-width:600px) {
  .carousel {
  width: 100%;
  }
 }

关于css - Twitter Bootstrap轮播，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/11136865/