javascript - 更改 bootstrap 3 模态宽度以保持响应能力

Question

我刚刚阅读 this article你可以用这个改变 Bootstrap 模式宽度:

.modal .modal-dialog { width: 800px; }

但是当我这样做时，我失去了模式的默认响应能力。

如何更改宽度但在移动设备上保持响应能力？

Answer 1

只需使用最大宽度。它将变得有响应-

.modal .modal-dialog { width: 800px; max-width:100%; }

或者，您可以通过媒体查询来完成。

@media only screen and (max-width: 480px) {
    .modal .modal-dialog {
        position:relative;
        width:auto;
        margin: 10px;
    }
}