关于修改swiper轮播图插件中的小圆点变成背景图

当我们使用swiper插件时，底部的小点点需要修改成图片样式的形状，下面分享一下如何修改：

<!-- Add Pagination -->
<div class="swiper-pagination">
                    
</div

找到上面插件中对应的代码，这就是小点点对应的代码，下面是如何修改：

.swiper-pagination .swiper-pagination-bullet:nth-child(1){
 background: url(../首页/img/tu1.png);
 width: 82px;
 height: 82px;

}
.swiper-pagination .swiper-pagination-bullet:nth-child(2){
  background: url(../首页/img/tu2.png);
  width: 82px;
  height: 82px;
 }
 .swiper-pagination .swiper-pagination-bullet:nth-child(3){
  background: url(../首页/img/tu3.png);
  width: 82px;
  height: 82px;
 }

可以分别选取不同的点点进行修改样式，主要思路是用css样式覆盖，自己写一些想要的样式进行修改。如果想统一修改，那就把nth-child（）去掉即可。

下面是效果图：