<style> .container {height: 100px;overflow: hidden;} .slide-item {display: flex;justify-content: center;align-items: center;color: white;font-size: 42px;} .item1 {background-color: cornflowerblue;} .item2 {background-color: darkslateblue;} .item3 {background-color: darkorange;} </style> <div class="container"> <div class="swiper-wrapper"> <div class="swiper-slide slide-item item1">第一屏</div> <div class="swiper-slide slide-item item2">第二屏</div> <div class="swiper-slide slide-item item3">第三屏</div> </div> </div> <link href="https://cdn.bootcdn.net/ajax/libs/Swiper/5.4.5/css/swiper.min.css" rel="stylesheet"> <script src="https://cdn.bootcdn.net/ajax/libs/Swiper/5.4.5/js/swiper.min.js"></script> <script> var mySwiper = new Swiper('.container', { autoplay: true, // 自动切页 }); </script>