可滚动卡片引导答案

【问题标题】：Scrollable Card bootstrap可滚动卡片引导
【发布时间】：2021-07-05 18:28:23
【问题描述】：

我正在使用 bootstrap 4。我在一行中有 3 列。其中一列包含一个列表，而另外两列不包含。我只希望带有列表的列可滚动，而不是整个容器，这意味着滚动条只能出现在该列中。

我将不胜感激。

<div class="row">
<div class="col-sm-4">
  <div class="card">...

<div class="col-sm-4">
  <div class="card">...

<div class="col-sm-4">
  <div class="card">...

</div>

【问题讨论】：

你能分享你的完整代码吗？
您是否尝试在可滚动卡片中设置 CSS 高度和溢出？否则，您需要说明您尝试过的内容以及具体的无效内容。

标签： css bootstrap-4

【解决方案1】：

你可以这样做：

    <div class="row">
      <div class="col-sm-4">
        <div class="card">...</div>
      </div>
      <div class="col-sm-4 scroll">
        <div class="card">...</div>
      </div>
      <div class="col-sm-4">
        <div class="card">...</div>
      </div>
    </div>

然后在你的css中：

.scroll {
    max-height: 100px;
    overflow-y: auto;
}

【讨论】：