PCアダプタの画像は1190pxを中心にできます

<div key={index}>
 <div className="mat" style={{ backgroundImage: `url('${item}')` }}>
   <div className="swiper-container">
     <img src={item} alt="" className="img" />
   </div>
 </div>
</div>
.swiper-container {
  width: 1190px !important;
  margin-left: auto;
  margin-right: auto;
  display: block;
  height: 400px;
  overflow: hidden;
  position: relative;
  .img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
}
.mat {
  background-size: 100% 100%;
  height: 400px;
}
.swiper-wrap {
  background-color: pink;
}

最初は完全に、それは、中央画像パッケージボックスによって配置されている背景画像の表示に一致するように、背景画像を設定します。

リリース5元の記事 ウォンの賞賛5 ビュー1082

おすすめ

転載: blog.csdn.net/sinat_41479229/article/details/89217268