现在页面制作越来越便捷，制作轮播图也很简单。
下面是轮播图的截图：
一共有四页，这是其中的两页，下面让我们来看看代码：
<script src="js/jquery-3.2.1.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<link rel="stylesheet" href="css/bootstrap.css" /> //这里引入jquery和bo0tstrap框架，是写代码更加简单便捷，也需要导入深css样式，不然轮播图会出问题。
<ol class="carousel-indicators">
<li class="active" data-slide-to="0" data-target="#carousel-519501">
</li>
<li data-slide-to="1" data-target="#carousel-519501">
</li>
<li data-slide-to="2" data-target="#carousel-519501">
</li>
</ol>
<div class="carousel-inner">
<div class="item active">
<img alt="" src="img/one.jpg" />
<div class="carousel-caption">
<h4>
First Thumbnail label
</h4>
<p>
Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.
</p>
</div>
</div>
<div class="item">
<img alt="" src="img/two.jpg" />
<div class="carousel-caption">
<h4>
Second Thumbnail label
</h4>
<p>
Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.
</p>
</div>
</div>
<div class="item">
<img alt="" src="img/three.jpg" />
<div class="carousel-caption">
<h4>
Third Thumbnail label
</h4>
<p>
Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.
</p>
</div>
</div>
<div class="item">
<img alt="" src="img/fore.jpg" />
<div class="carousel-caption">
<h4>
Third Thumbnail label
</h4>
<p>
Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.
</p>
</div>
</div>
</div>
<a class="left carousel-control" href="#carousel-519501" data-slide="prev"><span class="glyphicon glyphicon-chevron-left"></span></a> <a class="right carousel-control" href="#carousel-519501" data-slide="next"><span class="glyphicon glyphicon-chevron-right"></span></a>
</div>
//4张图片循环滚动
轮播图很容易使用，如果想深入了解可以查询相关资料。
在这里我要分享一个bootstrap的一个插件，网址是http://www.ibootstrap.cn/，希望对你会有帮助，对了
www.jq22.com里也有很多不错的插件，很美观，做出来的效果也比较能吸引顾客吧。
www.jq22.com