修改Swiper分页器样式

默认样式

修改样式

<style>
	//圆点变横线，修改背景色
	.swiper-pagination-bullet-active,
    .swiper-pagination-bullet {
        width: 48px;
        height: 4px;
        border-radius: 0px;
        background-color: #000;
        opacity: 1;
    }
	//修改选中的颜色
    .swiper-pagination-bullet-active {
        background-color: seagreen;
    }
    
	//修改边距
    .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
        margin: 4px 20px;
    }
</style>