css - 具有垂直可滚动卡片文本的固定高度 Bootstrap 卡片

Question

我怎样才能达到 固定高度 具有垂直可滚动 的 bootstrap 4 卡卡片文字部分？

<div class="card" style="height:300px">        <-- non scrollable
    <div class="card-body">                    <-- non scrollable
        <h5 class="card-title">Card title</h5> <-- non scrollable
        <p class="card-text">This portion and only this portion will have a very long text so much so that the vertical scroll bar may appear when required.</p>
    </div>
</div>

Answer 1

您必须包装 .card-text带有一个可滚动的容器。然后设置可滚动容器overflow-y: auto; .

不要忘记设置 height也适用于可滚动容器。如果 height 将不会出现滚动条默认为自动。

https://codepen.io/blackcityhenry/pen/LXOOgW