前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >AntUI滑块Sliders

AntUI滑块Sliders

作者头像
爱知汇
发布2020-10-10 10:10:42
2.4K0
发布2020-10-10 10:10:42
举报
文章被收录于专栏:网页开发/美化网页开发/美化

浅色分页器

代码语言:javascript
复制
<style>.demo-swiper.swiper-container {    height: 150px;    overflow: hidden;    margin: 0 10px;    padding-top: 10px;
}.demo-swiper .swiper-slide {    line-height: 140px;    text-align: center;    background: #108EE9;    color: #ffffff;
}</style><div class="demo-swiper am-carousel swiper-container" id="J-swiper">
    <div class="swiper-wrapper">
        <div class="swiper-slide">A1</div>
        <div class="swiper-slide">A2</div>
        <div class="swiper-slide">A3</div>
        <div class="swiper-slide">A4</div>
        <div class="swiper-slide">A5</div>
    </div>
    <div class="swiper-pagination"></div></div><script>var mySwiper1 = new Swiper ('#J-swiper', {
    pagination: '.swiper-pagination',
    loop: true,
    initialSlide: 2});</script>

深色分页器

代码语言:javascript
复制
<style>.demo-swiper.swiper-container {    height: 150px;    overflow: hidden;    margin: 0 10px;    padding-top: 10px;
}.demo-swiper .swiper-slide {    line-height: 140px;    text-align: center;    background: #ffffff;    color: #108EE9;
}</style><div class="swiper-container am-carousel am-sp-white demo-swiper" id="J-swiper">
    <div class="swiper-wrapper">
        <div class="swiper-slide">A1</div>
        <div class="swiper-slide">A2</div>
        <div class="swiper-slide">A3</div>
        <div class="swiper-slide">A4</div>
        <div class="swiper-slide">A5</div>
    </div>
    <div class="swiper-pagination"></div></div><script>var mySwiper1 = new Swiper ('#J-swiper', {
    pagination: '.swiper-pagination',
    loop: true,
    initialSlide: 2});</script>
本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2020-09-25 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 浅色分页器
  • 深色分页器
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档