Carousel图像不会在Bootstrap中加载

时间:2016-06-12 14:36:47

标签: jquery html css twitter-bootstrap carousel

我有以下代码,在浏览器中加载时,图片不会加载到轮播中并返回:

  

无法加载资源:服务器响应状态为404

项目目录图片
enter image description here

<div id="carousel" class="carousel slide">
<!-- Carousel Indicators-->
<ol class="carousel-indicators">
    <li class="active" data-target="#carousel" data-slide="0"></li>
    <li data-target="#carousel" data-slide="1"></li>
    <li data-target="#carousel" data-slide="2"></li>
</ol>

<!-- First Slide -->
<div class="carousel-inner">
    <div class="item active">
        <img src="/images/me-slider-background.jpg"/>
        <div class="carousel-caption">
            <h3>First slide</h3>
            <p>Description</p>
        </div>
</div><!-- Second Slide -->
    <div class="item">
        <img src="/images/me-slider-background.jpg"/>
        <div class="carousel-caption">
            <h3>Second Slide</h3>
            <p>Description</p>
        </div>

    </div>

        <!-- Left and right controls -->
        <a href="#carousel" class="left carousel-control" data-slide="prev">
            <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
            <span class="sr-only">Previous</span>
        </a>
        <a href="#carousel" class="right carousel-control" data-slide="next">
            <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
                <span class="sr-only">Next</span>
        </a>
    </div>

</div>`

1 个答案:

答案 0 :(得分:1)

您写的图片来源不正确,因为您不在根目录中。

做这样的事情:

<img src="../images/me-slider-background.jpg"/>