jquery - Bootstrap 旋转木马未在中心对齐

Question

我正在用 bootstrap 开发一个轮播，目标是显示 5 张图片，每次滑动时，它前进 1 张。

我目前实际遇到的问题是元素未显示在框内且交易不干净。

这是完整的 code .有人知道如何解决这个问题吗？ 提前感谢您的回复!

Answer 1

试试这个(根据您的喜好定制):

<div id="imgCarouselSlider" class="carousel slide">
        <ol class="carousel-indicators">
            <li data-target="#imgCarouselSlider" class="active" data-slide-to="0" ></li>
            <li data-target="#imgCarouselSlider" data-slide-to="1" ></li>
            <li data-target="#imgCarouselSlider" data-slide-to="2" ></li>
            <li data-target="#imgCarouselSlider" data-slide-to="3" ></li>
        </ol>
        <div class="carousel-inner">
            <div class="item active">
                <img src="img/carousel-img1.png" class="img-responsive"/>
            </div>
            <div class="item">
                <img src="img/carousel-img2.png" class="img-responsive"/>
            </div>
            <div class="item">
                <img src="img/carousel-img3.png" class="img-responsive"/>
            </div>
            <div class="item">
                <img src="img/carousel-img4.png" class="img-responsive"/>
            </div>
        </div>
        <a class="carousel-control left" href="#imgCarouselSlider" data-slide="prev">
            <span class="icon-prev"></span>
        </a>
        <a class="carousel-control right" href="#imgCarouselSlider" data-slide="next">
        <a class="carousel-control right" href="#imgCarouselSlider" data-slide="next">
            <span class="icon-next"></span>
        </a>
    </div>

如果它不起作用；只需在外面添加一个容器 div。