给网站加上一个图片并排横向拖动的玩意。

效果图如下：

代码如下：

  <style>
   .image-container {
      display: flex;
      overflow-x: auto;
      white-space: nowrap;
      height: 50vh; /* 使用视口高度的百分比来设置容器高度，50vh 表示占视口高度的一半 */
      gap: 2px; /* 设置图片之间的间距 */
    }

   .image-item {
      flex: 0 0 auto;
      margin-right: 10px;
      object-fit: contain;
      transform: scale(0.5); /* 调整这个缩放比例来控制图片大小 */
    }
  </style>
<div class="image-container">
    <img class="image-item" src="https://media.9game.cn/gamebase/2024/4/25/43475f89969db3a31d5ea8ae8f3b1e33.jpg" >
   <img class="image-item" src="https://media.9game.cn/gamebase/2024/4/25/a4bd253d1557561de480322d4b677fc6.jpg" >
    <img src="https://media.9game.cn/gamebase/2024/4/25/3dab705f865cc1a129d7e24f41232802.jpg" >
</div>