pagination
使用分页器导航。分页器可使用小圆点样式（默认）、分式样式或进度条样式。
swiper5新增可以通过设置Swiper的风格
如果只有一个slide，则隐藏分页器导航（6.8.1）。
swiper5新增可以通过设置Swiper的风格
--swiper-theme-color或单独设置分页器风格--swiper-pagination-color来改变分页器颜色。如果只有一个slide，则隐藏分页器导航（6.8.1）。
pagination信息
- 类型：
- object
- 启用版本：
- 4.0.0
效果演示
使用方法示例
从Swiper7开始，容器默认类名由'.swiper-container'变更为'.swiper'。
<div class="swiper">
<div class="swiper-wrapper">
<div class="swiper-slide">Slide 1</div>
<div class="swiper-slide">Slide 2</div>
<div class="swiper-slide">Slide 3</div>
</div>
<div class="swiper-pagination"></div><!--分页器。如果放置在swiper外面，需要自定义样式。-->
</div>
<script language="javascript">
var mySwiper = new Swiper('.swiper',{
pagination: {
el: '.swiper-pagination',
},
})
</script>
<style type="text/css">
.swiper{
--swiper-theme-color: #ff6600;
--swiper-pagination-color: #00ff33;/* 两种都可以 */
}
</style>
转载原创文章请注明：文章转载自：Swiper中文网 [https://www.swiper.com.cn]
本文地址：https://www.swiper.com.cn/api/pagination/362.html