【Antd】 走马灯Carousel自动轮播加左右切换箭头

组件内容:

 <Carousel 
   autoplay 
   afterChange={changeBanner} 
   autoplaySpeed={7000} 
   //添加左右切换箭头
   arrows={true} 
   prevArrow={<LeftOutlined />} 
   nextArrow={<RightOutlined />}>
 <Carousel/>

css样式:

.ant-carousel .slick-prev,
  .ant-carousel .slick-prev:hover,
  .ant-carousel .slick-prev:focus {
    font-size: inherit;
    left: 10px;
    z-index: 2;
    color: blueviolet;
  }

  .ant-carousel .slick-next,
  .ant-carousel .slick-next:hover,
  .ant-carousel .slick-next:focus {
    font-size: inherit;
    right: 10px;
    z-index: 2;
    color: blueviolet;
  }

 

posted @ 2023-05-17 13:08  维多利亚的巴黎世家  阅读(1950)  评论(0)    收藏  举报