如何利用wrap和内联块使javascript卡片溢出

<style>
  .card-container {
    width: 300px; /* 容器宽度 */
    height: 200px; /* 容器高度 */
    border: 1px solid #ccc;
    overflow: hidden; /* 隐藏溢出部分 */
    white-space: nowrap; /* 不换行 */
  }

  .card {
    display: inline-block; /* 显示为内联块级元素 */
    width: 100px; /* 卡片宽度 */
    height: 150px; /* 卡片高度 */
    margin-right: 10px; /* 卡片间距 */
    background-color: #f1f1f1;
  }
</style>

<div class="card-container">
  <div class="card">Card 1</div>
  <div class="card">Card 2</div>
  <div class="card">Card 3</div>
  <div class="card">Card 4</div>
  <div class="card">Card 5</div>
  <div class="card">Card 6</div>
</div>