使Twitter Bootstrap模态窗口变大

Question

我正在使用Bootstrap模态框来显示图片。

如何简单地使Twitter Bootstrap模态窗口变大？

我正在使用与（相关）问题中相同的代码：

$('#myModal').modal({
        backdrop: true,
        keyboard: true,
        show: false
    }).css({
        // make width 90% of screen
       'width': function () { 
           return ($(document).width() * .9) + 'px';  
       },
        // center model
       'margin-left': function () { 
           return -($(this).width() / 2); 
       }
});

但是这是结果：

我必须向下滚动。如何保持图像比例并在不使用滚动条的情况下显示它？

- lexeme

---

完全没有关联，但我不喜欢驼峰式的css选择器。但这只是个人口味 :) - nathanvda

我也是。我喜欢用破折号分割它们。我只是从源代码中复制了它，就这样 :) - lexeme

Answer 1

当我们在Bootstrap模态框中展示图片时，需要使用以下CSS代码：

#myModal {
  max-height: 80%;
  overflow-y: auto;

  .modal-body {
    max-height: none;
    text-align: center;
  }
}

然后只需要执行

$('#myModal').modal("show");

重点是将 .modal-body 上的 max-height 设置为 none。

- nathanvda

---

抱歉，这是真的：我在大多数项目中使用sass（我是rails开发者）。 - nathanvda