添加下面的css到你的html，并尝试改变顶部，右侧，底部，左侧的值。

.modal {
   position: absolute;
   top: 10px;
   right: 100px;
   bottom: 0;
   left: 0;
   z-index: 10040;
   overflow: auto;
   overflow-y: auto;
}

我设置这个类得到了更好的结果：

.modal-dialog {
  position: absolute;
  top: 50px;
  right: 100px;
  bottom: 0;
  left: 0;
  z-index: 10040;
  overflow: auto;
  overflow-y: auto;
}

使用bootstrap 3.3.7。
(all感谢msnfreaky的想法…）

如果需要更改modal的底部位置，则需要修改modal-body的max-height：

.modal-body {
  max-height: 75vh;
}

正如其他答案所说，您可以调整modal-dialog上的右侧和顶部：

.modal-dialog {
  top: 10vh;
  right: 5vw;
}

• “vh”表示“视图高度的%”
• “vw”表示“视图宽度的%”

要更改视图中的Modal位置，可以将Modal div id作为目标，在本例中，此id为myModal3

<div id="modal3" class="modal">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
        <h4 class="modal-title">Modal title</h4>
      </div>
      <div class="modal-body">
        <p>One fine body…</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>
    </div>
  </div>
</div>

#myModal3 {
top:5%;
right:50%;
outline: none;
overflow:hidden;
}

对于Bootstrap 5，只需将其添加到您的css中。

.modal-dialog { top: 7rem !important; }

不要添加到.modal，否则当点击模式的顶部时，模式将不会被取消，因为背景也会向下移动。

在CSS文件中添加以下行：

.modal-dialog {
  transform: translateY(50%)!important;
}

您可以将50%更改为任何其他值，这将解决浏览器中的问题。

在Bootstrap 5中，有两个选项可以在中心打开模态。无需添加任何自定义CSS。
1.
...
...
我希望这也能有所帮助。

我知道这有点晚，但我有一个问题，模态窗口不允许菜单栏上的一些链接工作，即使它没有被触发。但我通过以下方法解决了这个问题：

.modal{
display:none;
}