这将使图像在模态内居中。

.modal-body > .img-responsive {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

它必须通过添加更多类来工作：

<style>
  .img-center {
    display: block;
    margin-left: auto;
    margin-right: auto;
}
</style>

• ========更新的答案=========*

我确实看到了你的链接中的图像超出了你的div容器，这里是需要做什么来解决这个问题。忘记之前提供的所有代码，让我们重新开始。给position:relative;一个.modal-body将避免超出容器的图像，这里有一个例子：

.modal-body {
    position:relative; /* This avoids whatever it's absolute inside of it to go off the container */
    height: 250px; /* let's imagine that your login box height is 250px . This height needs to be added, otherwise .img-responsive will be like "Oh no, I need to be vertically aligned?! but from which value I need to be aligned??" */
}

然后，通过设置类.img-responsive的样式来创建居中的登录图像

.img-responsive {
    width:50px; /* This value will depend on what size you want for your loading image, let's say it's 50px */
    height: 50px;
    position:absolute;
    left:50%;
    top:50%;
    margin-top:-25px; /* This needs to be half of the height */
    margin-left:-25px; /* This needs to be half of the width */
}

• • 一个

要解决此问题，只需添加bootstrap的img-fluid类。
代码看起来像这样

<div id="processing" class="modal fade">
    <div class="modal-dialog" style="max-width: 350px">
        <div class="modal-content">
            <div class="panel-heading modal-header dialog-header">
                <h4 class="modal-title">Please Wait...</h4>
            </div>
            <div class="modal-body" style="height: 230px;">
                <img src="~/images/ajax-loader.gif" class="img-fluid" />
            </div>
        </div>
    </div>
</div>