Question

我在MVC 5 / Bootstrap应用程序中获得了以下HTML。如您所见，我试图在模态对话框中显示照片。这很好用。但是，如果照片比对话框宽，则它会超出对话框的范围。有没有办法让对话框扩展到某一点，然后根据内容的大小（图像）显示滚动条？

<div class="modal fade" id="viewPhotoDialog" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h4>Ask the Experts</h4>
            </div>
            <div class="modal-body">
                <img src="@Url.Action("GetPhoto", new { askTheExpertId = @Model.AskTheExpertId })" alt="" title=""/>
            </div>
            <div class="modal-footer">
                <button class="btn btn-primary" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>

Answer 1

您可以将.img-responsive类添加到img（给出max-width：100％和自动高度）。关于模态宽度，您可以在modal-lg添加2个额外选项类modal-sm和.modal-dialog http://getbootstrap.com/javascript/#modals

MVC 5 / Bootstrap应用程序 - 模态对话框自动扩展？

1 个答案: