flex-shrink: 100 !important;
width: **set according to your design**;

真管用！

据我所知，没有一个标准的方法可以使幻灯片的宽度等于内容的宽度。但是，您可以在CSS文件中手动指定每张幻灯片的宽度，如下所示：

• • 超文本标记语言：**

<!-- Slider main container -->
<div class="swiper">
  <!-- Additional required wrapper -->
  <div class="swiper-wrapper">
    <!-- Slides -->
    <div class="swiper-slide">Slide 1</div>
    <div class="swiper-slide">Slide 2</div>
    <div class="swiper-slide">Slide 3</div>
    ...
  </div>
  <!-- If we need pagination -->
  <div class="swiper-pagination"></div>

  <!-- If we need navigation buttons -->
  <div class="swiper-button-prev"></div>
  <div class="swiper-button-next"></div>

  <!-- If we need scrollbar -->
  <div class="swiper-scrollbar"></div>
</div>

• • 中央支助组：**

.swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
}

.swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.swiper-slide {
    width: 50%;
}

.swiper-slide:nth-child(2n) {
    width: 20%;
}

.swiper-slide:nth-child(3n) {
    width: 40%;
}

同时在CSS文件中导入以下两行代码：

swiper/css
swiper/css/bundle

• • 联属萨摩亚**

const swiper = new Swiper('.swiper', {
  speed: 400,
  spaceBetween: 100,
});

幻灯片每视图："自动"
和CSS中。swiper-slide {宽度：适合含量}