轮播图的实现

第一步创建三个文件

.html文件， .css文件, .js文件

在创建一个img文件夹用来放图片

我这里的文件名字：轮播图.html 轮播图.css 轮播图.js（文件名最好是英文）

第二步：通过html把框架搭好

引入js

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.0.1/css/swiper.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.0.1/js/swiper.min.js"></script>

第三步：写css样式

第四步;通过写js来改变图片的left值，使其动态显示

<script>
    var mySwiper = new Swiper('.swiper', {
        autoplay: true,//可选选项，自动滑动
    })

</script>