修改小程序swiper轮播指示点样式

最新推荐文章于 2023-11-10 16:46:12 发布

bug修复器

最新推荐文章于 2023-11-10 16:46:12 发布

阅读量1k

点赞数

分类专栏：小程序

本文链接：https://blog.csdn.net/h5wangbq/article/details/103681372

版权

小程序专栏收录该内容

5 篇文章 0 订阅

订阅专栏

小程序swiper指示点样式修改

- - - - part3就是父盒子盒子，这个随意，这就是要设定的轮播的盒子就行

part3就是父盒子盒子，这个随意，这就是要设定的轮播的盒子就行

.part3 .wx-swiper-dots.wx-swiper-dots-horizontal{   
     margin-bottom: 2rpx;
}
.part3 .wx-swiper-dot{     //指示器大小等
    width:12rpx;
    display: inline-flex;
    height: 12rpx;
    justify-content:space-between;
}
.part3 .wx-swiper-dot::before{ //指示器默认颜色
    content: '';
    flex-grow: 1; 
    background: #ccc;
    border-radius: 8rpx
}
.part3 .wx-swiper-dot-active::before{  //当前指示器的颜色
    background:#00aeff;   
}