使用引导程序在页面上创建一个图像中心

Question

我正在使用最新版本的bootstrap,我试图在旋转木马的页面上将我的图像置于死点.

我将container课程放在旋转木马的主要div中,但它仍然偏离页面左侧的中心位置？

我的旋转木马代码如下:

<!-- Main Carousel -->
<div id="carousel-example-generic" class="carousel slide container" data-ride="carousel">
  <div class="carousel-inner">
    <div class="item active">
      <img src="assets/img/carousel/slide01.jpg" alt="Ants climbing on grass">
      <div class="carousel-caption">
        Ants climbing on grass
      </div>
    </div>
  </div>
</div>
<!-- End Main Carousel -->

根据我在互联网上发现的内容,该container课程应该将所有内容集中在页面上.那么这里发生了什么,我该如何解决呢？

我还尝试围绕以下代码包装整个轮播,但实现了相同的结果.

<div class="container">
 <!-- Carousel inside here -->
</div>

Answer 1

对于Bootstrap 3,class ="img-responsive center-block"将执行此操作.

只需为所有图片添加如下: <img class="img-responsive center-block" src="assets/img/carousel/slide01.jpg">