请教， bootstrap 的 modal，如何让其高度等于屏幕的高度，然后在 modal 内部出现垂直滚动条！

[leedstyh]

[halden]

bootstrap 默认将.modal-dialog 的高度设成 600px(>768px)，或者 auto(small screens)，要改的话用 script

$(document).ready(function(e) {
$('.modal-dialog').css({height:'100%', border: 0, padding: 0, 'max-height':'100%'});
$('.modal-content').css({height:'100%', 'max-height':'100%'});
});

滚动条在 css 里面写
.modal-content{ overflow-y:scroll; }

不知道你是不是要这样的效果，还是说你只要 content 内的 body 做滚动

[sherlocktheplant]

.modal-dialog {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
}

.modal-content {
overflow-y: scroll;
position: absolute;
top: 0;
bottom: 0;
}

如果有没有生效的样式 可以加个!important

[leedstyh]

@halden @sherlocktheplant

谢谢二位，代码很有用，十分感谢

[leedstyh]

@sherlocktheplant 另外再想把 .modal-header 部分固定在 modal 的上部呢，

[leedstyh]

@sherlocktheplant

我照猫画虎的添加了

.modal-header {
position: fixed;
top: 0;
right: 10px;
left: 0;
}

.modal-body {
padding-top: 50px;
}

但是那个关闭按钮（ x ）无法点击了

其实我就是想让 modal 的内容可以滚动，然后那个关闭按钮（ x ）一直固定在一个位置，然后用户可以不管往下拉到哪，都可以随时点击（ x ）关掉 modal 。

[leedstyh]

@sherlocktheplant

.modal-dialog {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
}

.modal-content {
/*overflow-y: scroll; */
position: absolute;
top: 0;
bottom: 0;
width: 100%;
}

.modal-body {
overflow-y: scroll;
position: absolute;
top: 50px;
bottom: 0;
width: 100%;
}

.modal-header .close {margin-right: 15px;}

我这么改了下，看起来可以工作，对 css 实在太不熟悉了！能麻烦帮我看下这么改行吗

[sherlocktheplant]

@leedstyh 没什么大的问题 就是有点乱而已