BootStrap实现图片轮播
<div class="container">
<div data-ride="carousel" id="carousel_container" class="carousel slide">
<!-- 图片容器 -->
<div class="carousel-inner">
<div class="item"><img src="images/1.jpg" style="width:500px height:100px"></div>
<div class="item active"><img src="images/2.jpg"></div>
<div class="item"><img src="images/3.jpg"></div>
</div>
<!-- 小圆圈 -->
<ol class="carousel-indicators">
<li data-slide-to="0" data-target="#carousel_container"></li>
<li data-slide-to="1" data-target="#carousel_container"></li>
<li data-slide-to="2" data-target="#carousel_container"></li>
</ol>
<!-- 左右按钮 -->
<a href="#carousel_container" data-slide="prev" class="left carousel-control">
<span class="glyphicon glyphicon-chevron-left"></span>
</a>
<a href="#carousel_container" data-slide="next" class="right carousel-control">
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
</div>
</div>
<div data-ride="carousel" id="carousel_container" class="carousel slide">
<!-- 图片容器 -->
<div class="carousel-inner">
<div class="item"><img src="images/1.jpg" style="width:500px height:100px"></div>
<div class="item active"><img src="images/2.jpg"></div>
<div class="item"><img src="images/3.jpg"></div>
</div>
<!-- 小圆圈 -->
<ol class="carousel-indicators">
<li data-slide-to="0" data-target="#carousel_container"></li>
<li data-slide-to="1" data-target="#carousel_container"></li>
<li data-slide-to="2" data-target="#carousel_container"></li>
</ol>
<!-- 左右按钮 -->
<a href="#carousel_container" data-slide="prev" class="left carousel-control">
<span class="glyphicon glyphicon-chevron-left"></span>
</a>
<a href="#carousel_container" data-slide="next" class="right carousel-control">
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
</div>
</div>