如果你只支持IE 9或更高版本，你可以使用这个CSS来平滑地缩放到窗口的大小。你可能需要调整“200px”，这取决于你的页眉或页脚的高度。

.modal-body{
    max-height: calc(100vh - 200px);
    overflow-y: auto;
}

卡洛斯·卡拉的回答很好。

.modal-body的高度必须设置，但是你可以使用媒体查询来确保它适合屏幕大小。

.modal-body{
    height: 250px;
    overflow-y: auto;
}

@media (min-height: 500px) {
    .modal-body { height: 400px; }
}

@media (min-height: 800px) {
    .modal-body { height: 600px; }
}

问题解决了结合解决方案@卡洛斯卡拉和@乔纳森马斯顿。

    /* Important part */
.modal-dialog{
    overflow-y: initial !important
}
.modal-body{
    max-height: calc(100vh - 200px);
    overflow-y: auto;
}

一个简单的js解决方案来设置模式高度成比例的身体的高度:

$(document).ready(function () {
    $('head').append('<style type="text/css">.modal .modal-body {max-height: ' + ($('body').height() * .8) + 'px;overflow-y: auto;}.modal-open .modal{overflow-y: hidden !important;}</style>');
});

身体的高度必须是100%

html, body {
    height: 100%;
    min-height: 100%;
}

我将模态体高度设置为体的80%，这当然可以定制。

希望能有所帮助。

或者更简单一点，你可以先放在标签之间，然后放到css类中。

<div style="height: 35px;overflow-y: auto;"> Some text o othre div scroll </div>

#scroll-wrap {
    max-height: 50vh;
    overflow-y: auto;
}

在模态体上使用max-height和vh作为单位，或者在模态体内部使用包装器div。当用户调整窗口大小时，这将自动调整模态体或包装div(在本例中)的高度。

Vh是长度单位，表示视口高度占视口大小的1%。

vh单元的浏览器兼容性图表。

例如:https://jsfiddle.net/q3xwr53f/