Bootstrap 轮番插件

轮番

Bootstrap轮番插件Carousel是一个灵活的、响应式的、无缝循环播放的幻灯片切换插件，它的内容可以是图片、视频、或者其他任何内容。

Bootstrap轮番插件Carousel需要 bootstrap-carousel.js 文件支持，在使用该插件之前，应该导入 jQuery 和 bootstrap-carousel.js 文件。

使用方法

Bootstrap中，一个轮番包含在一个 class="carousel" 的容器中，其中包含轮番指示器、轮番内容、轮番的控制按钮。还要为容器定义一个 id，以确保在播放时，能够对控制按钮和轮番指示器进行正常定位。如：

1. id="myCarousel" class="carousel">
2.   ...

1）轮番指示器

轮番指示器是一个 class="carousel-indicators" 的有序列表，用来指示有多少个轮番条目，它包含的

元素的个数，就是轮番条目的个数。还可以为默认活动的

元素添加 .active 类。如：

1. class="carousel-indicators">
2.   class="active">
3.  
5.  

2）轮番内容

轮番内容是一个轮番条目的列表，整个列表包含在一个 class="carousel-inner" 的容器中，列表中可以包含多个轮番条目，每个轮番条目包含在一个 class="item" 的容器中。还可以为默认活动的轮番条目添加 .active 类，并确保与列表指示器中的定义一致。

最简单的轮番内容只包含图片就可以了。如：

1. class="carousel-inner">
2.   class="item active">
3.     src="slide-01.jpg" />
4.  

稍微复杂的轮番条目还可以包含标题和说明，并放在一个 class="carousel-caption" 的容器中。如：

1. class="carousel-inner">
2.   class="item active">
3.     src="slide-01.jpg" />
4.     class="carousel-caption">
5.      

   Second Thumbnail label

6.      

   Cras justo odio, dapibus ...

7.