bootstrap图片轮播由哪三部分组成

一个轮播图片主要包括三个部分：

☑ 轮播的图片

☑ 轮播图片的计数器

☑ 轮播图片的控制器

第一步：设计轮播图片的容器。在 Bootstrap 框架中采用 carousel 样式，并且给这个容器定义一个 ID 值，方便后面采用 data 属性来声明触发。

代码如下:

<div></div>

第二步：设计轮播图片计数器。在容器 div.carousel 的内部添加轮播图片计算器，采用 carousel-indicators 样式，其主要功能是显示当前图片的播放顺序(有几张图片就放置几个li)，一般采用有顺列表来制作：

<div><!-- 设置图片轮播的顺序 --> <ol> <li>1</li> <li>2</li> <li>3</li> <li>4</li> <li>5</li></ol></div>

第三步：设计轮播图片播放区。轮播图整个效果中，播放区是最关键的一个区域，这个区域主要用来放置需要轮播的图片。这个区域使用 carousel-inner 样式来控制，而且其同样放置在 carousel 容器内，并且通过 item 容器来放置每张轮播的图片：

<div> <!-- 设置图片轮播的顺序 --> <ol> <li>1</li> … </ol> <!-- 设置轮播图片 --> <div> <div> <a>@@##@@</a> </div> <div> <a>@@##@@</a> </div> … <div> <a>@@##@@</a> </div> </div></div>