带有可垂直滚动的卡片文本的固定高度 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;。

不要忘记设置heightfor 可滚动容器。如果height默认为自动，则不会出现滚动条。

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