jquery - Bootstrap slider 图像不显示

Question

这是代码，

 <header id="myCarousel" class="carousel slide">
        <!-- Indicators -->
        <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>

        <!-- Wrapper for slides -->
        <div class="carousel-inner">
            <div class="item active">
                <div class="fill" style="background-image:url(http://s23.postimg.org/9nq4ybppn/home_slider1.jpg one);"></div>
                <div class="carousel-caption">
                    <h2>Caption 1</h2>
                </div>
            </div>
            <div class="item">
                <div class="fill" style="background-image:url(http://s23.postimg.org/su3c1i67f/home_slider2.jpg two);"></div>
                <div class="carousel-caption">
                    <h2>Caption 2</h2>
                </div>
            </div>
            <div class="item">
                <div class="fill" style="background-image:url(http://s23.postimg.org/v17kpfbhn/home_slider3.jpg three);"></div>
                <div class="carousel-caption">
                    <h2>Caption 3</h2>
                </div>
            </div>
        </div>
 </header>

我正在使用 bootstrap，但它不起作用..图像未显示..

我可以知道我错过了什么吗？

谢谢。

Answer 1

您可以使用此代码，也许效果很好。

<header id="myCarousel" class="carousel slide">
        <!-- Indicators -->
        <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>

        <!-- Wrapper for slides -->
        <div class="carousel-inner">
            <div class="item active">
                <div class="fill" style="background: url(http://s23.postimg.org/9nq4ybppn/home_slider1.jpg) no-repeat center center;background-size: 100%;min-height: 500px; "></div>

                <div class="carousel-caption">
                    <h2>Caption 1</h2>
                </div>
            </div>
            <div class="item">
                <div class="fill" style="background: url(http://s23.postimg.org/su3c1i67f/home_slider2.jpg) no-repeat center center;background-size: 100%;min-height: 500px; "></div>
                <div class="carousel-caption">
                    <h2>Caption 2</h2>
                </div>
            </div>
            <div class="item">
                <div class="fill" style="background: url(http://s23.postimg.org/v17kpfbhn/home_slider3.jpg) no-repeat center center;background-size: 100%;min-height: 500px; "></div>
                <div class="carousel-caption">
                    <h2>Caption 3</h2>
                </div>
            </div>
        </div>
    </header>