// 分页器
pagination: {
el: ".swiper-pagination",
// clickable设置为true时,点击分页器的指示点分页器会控制Swiper切换
clickable :true,
//修改分页器样式
bulletClass : 'swiper-pagination-bullet',
//激活样式
bulletActiveClass: 'my-bullet-active',
},
在本页面中写样式:(必须不能是less等,,否则读取不到,而bulletClass : 'swiper-pagination-bullet',,必须使用swiper-pagination-bullet来写样式,其它的话需要全新的去设计样式,)
<!--自定义分页器样式-->
<style type="text/css">
.my-bullet-active{
background: #ffffff;
opacity: 1;
}
.swiper-pagination-bullet{
width: 20px;
height: 20px;
background: #b3e9cf;
}
</style>
效果